2.4.5. Завантаження документа html у вікно браузера

Часто виникає задача - відобразити новий документ HTML у поточному вікні браузера, не створюючи нового вікна.

Такий сценарій (листинг 2.7) вирішує саме цю задачу.

Листинг 2.7. Файл chapter2/JumpTo/JumpTo. html

<HTML>

<HEAD>

<TITLE>Jump to other Web page</TITLE>

<SCRIPT LANGUAGE="JavaScript">

<!--

function urlJump()

{

var szNew'JRL="" ;

szNewURL=prompt("Enter new URL address:", "http://");

window. location. href=szNewURL;

}

<//-->

</SCRIPT>

</HEAD>

<BODY BGCOLOR=white>

<Hl>Jump to other Web page</Hl>

<FORM NAME="selectForm">

<P><INPUT TYPE="button" VALUE="Jump"

onClick="urlJump();">

</FORM>

</BODY>

</HTML>

Коли користувач натискає кнопку Jump у формі selectForm, запускается функція urIJump.

Ця функція викликає метод prompt, визначений у класі window:

var szNewURL="";

szNewURL=prompt("Enter new URL address:", "http://");

Метод prompt відображає на вікні монітора діалогову панель, призначену для запровадження текстового рядка. У нашому випадку це повиннао бути рядок адреси URL документа HTML, що буде завантажений у вікно браузера.

Введена адреса записується в перемінну szNewURL. Тепер можна переходити до завантаження нового документа у вікно браузера.

Коли рассказывалось про об'єкти класу window, те говорилося, що такі об'єкти містять у собі інші об'єкти. Зокрема, об'єкт window містить у собі об'єкт location, що описує розташування документа HTML, завантаженого у вікно браузера.

Для того щоб завантажити у вікно новий документ, достатньо змінити уміст властивості об'єкта location з ім'ям href:

window. location. href=szNewURL;

Ця властивість береже адреса URL документа. Зміна умісту властивості href об'єкта location головного вікна браузера призводить до завантаження в це вікно нового документа.

2.5. Об'єкт document

Lля роботи з документами HTML у мові JavaScript є окремий об'єкт із назвою document. Користуючи його властивостями і методами, сценарій JavaScript може одержати інформацію про поточний документ, завантаженому у вікно браузера, а також управляти відображенням умісту цього документа.

Перед тим, як перейти до опису властивостей і методів об'єкта document, варто роздивитися призначення окремих параметрів оператора <BODY>.

У загальному виді цей оператор виглядає в такий спосіб:

<BODY

BACKGROUND="Фонове_зображення"

BGCOLOR="Цвіт_фона"

TEXT="Цвіт_тексту"

LINK="Цвіт_непосещенных_посилань"

ALINK="Цвіт_активізованих_посилань"

VLINK=" Цвіт_посещенных_посилань "

onLoad="Оброблювач_події_при_завантаженню_документа"

onUnload="0бработчик_події_при_розаантаженню_документа"

</BODY>

Опис параметрів оператора приведено нижче:

Параметр Опис

BACKGROUND С поміччю цього параметра можна зазначити адресу URL зображення, що заповнює фон тіла документа

BGCOLOR Параметр BGCOLOR застосовується в тих випадках, коли фон документа необхідно розфарбувати в якийсь цвіт. Цвіт задається у виді "#rrggbb", де константи rr, gg і bb - відповідно червона, зелена і блакитна компоненти цвіту. Значення констант може знаходитися в діапазоні від 0 до FF (у шестнадцатеричном виді). Цвіт може також задаватися символічними константами, такими, як red або white

TEXT Цвіт тексту. Задається так само, як і цвіт фона BGCOLOR LINK Параметр LINK визначає цвіт посилань, розміщених у документі HTML і ще не посещенных користувачем

ALINK Цей параметр визначає цвіт посилань, обраних користувачем

VLINK Параметр VLINK визначає цвіт посилань, розміщених у документі HTML, що уже посещались користувачем раніше

OnLoad С поміччю параметра onLoad можна визначити оброблювач події, що одержить керування при завантаженні документа у вікно браузера

OnUnload Аналогічно попередньому, проте оброблювач події одержить керування при видаленні документа з вікна браузера

Аналізуючи властивості об'єкта document, сценарій JavaScript може визначити значення перерахованих вище параметрів. Крім того, сценарію доступні локальні мітки, форми і зв'язку документа як елементи відповідних масивів, а також інформація з заголовка документа.