Розміщення JavaScript на Web-сторінці

Методичні вказівки

1. Методичні вказівки

Розміщення JavaScript на Web-сторінці

Помилки у сценаріях та методи їх пошуку

Дата і час. Функції роботи з датою і часом

Обробники подій

Запити користувачу і змінні

Об'єктна модель документа. Основні об'єкти і властивості

Властивості об'єкту navigator

Властивості об'єкту document

Властивості об'єкту history

Дві властивості об'єкту location

Ієрархія об'єктів

Створення функцій в JavaScript

Команди післядії onMouseOut і onUnload

2. Порядок виконання роботи

В процесі самостійної роботи:

В навчальній лабораторії:

3. Зміст звіту

4. Завдання

5. Контрольні запитання

Розміщення JavaScript на Web-сторінці

Розглянемо сценарій

<SCRIPT LANGUAGE="javascript">

document.write

("<FONT COLOR='RED'>Это червоний текст </FONT>")

</SCRIPT>

Він призначений для знайомства з основами створення і розміщення JavaScript на Web-сторінці. Далі ви дізнаєтеся про те, що можна і чого не можна робити в JavaScript. Цей сценарій виводить текст на Web-сторінку:

Це червоний текст

Оскільки це дуже простий сценарій, то поговоримо спочатку про те, що таке JavaScript взагалі.

Перш за все треба пам'ятати, що JavaScript — це не HTML! Часто ставлять питання, чи не є перший просто іншою версією другого. Ні. Проте в JavaScript і HTML є дуже схожі правила.

По-перше, JavaScript розташовується усередині документа HTML. Де саме, ми обговоримо пізніше. JavaScript зберігається у вигляді тексту разом з документом HTML.

Головна ж різниця полягає в тому, що HTML багато що прощає з точки зору своєї форми запису. Не має значення, скільки пропусків ви залишаєте між словами або абзацами. По правді кажучи, HTML можна було б писати одним суцільним рядком.

Зовсім інша справа JavaScript. У нього чітка форма. І нехтувати нею можна лише зрідка. Наприклад, другий рядок сценарію виглядає так:

document.write

("<FONT COLOR='RED'> Це червоний текст</font>")

Він повністю знаходиться на одній лінії і повинен зберігати свою форму. Припустимо, ви скопіювали її в текстовий редактор з вузькими сторінками, і поля розірвали рядок:

document.write

("<FONT COLOR='RED'>Це червоний текст</font>

")

Ви змінили форму, і в сценарій вкралась помилка (далі ми розглянемо помилки і те, як їх виправляти).

Пишете ви сценарій або редагуєте, не давайте полям сторінки вставати у вас на дорозі. Завжди використовуйте для роботи текстовий редактор без полів. Йдеться не просто про широку сторінку. Мається на увазі ПОВНА ВІДСУТНІСТЬ ПОЛІВ. У вас має бути можливість написати рядок завдовжки в декілька кілометрів, інакше виникне багато проблем. Також важливо пам’ятати, що для JavaScript важливий регістр символів.

Повернемося до розбору сценарію. Почнемо з першого рядка:

<SCRIPT LANGUAGE="JavaScript">

Це код HTML, який дає браузеру зрозуміти, що з цього місця починається JavaScript. Будь-який сценарій JavaScript починається з такої команди. Частина LANGUAGE(мова)="JavaScript" вказує на те, який тип сценарію ми використовуємо (JavaScript, VBS, LiveScript, тощо). Отже команда LANGUAGE не дасть браузеру заплутатися.

Код </SCRIPT> закінчує будь-який сценарій JavaScript без виключень.

Основна частина сценарію: document.write("<FONT COLOR='RED'>Це червоний текст</FONT>")

За допомогою DOCUMENT оголошується документ (документ HTML). Цей документ буде змінений — в ньому щось буде написано (WRITE). Те, що буде написане, знаходиться усередині дужок.

DOCUMENT є об'єктом. Слово WRITE (писати), відокремлене крапкою, називається методом об'єкту. Таким чином, сценарій по суті говорить: "Візьміть об'єкт (щось, що вже існує) і щось в ньому запишіть".

Зверніть увагу, що текст усередині дужок знаходиться в лапках. У HTML ці лапки не потрібні. Тут вони необхідні. Ніколи не можна про них забувати.

Текст в лапках є простим кодом HTML. Легко побачити в ньому команду <FONT>, яка робить текст червоним. Зверніть увагу, що RED знаходиться в одинарних лапках. Якщо використовувати подвійні, JavaScript вирішить, що це кінець рядка, і вийде, що лише частина тексту буде записана в об'єкт, а це вже помилка.

Запам'ятайте: усередині подвійних лапок використовуються одинарні.

Виходить, що JavaScript перефарбував текст в червоний колір? Ні, це зробив HTML. А JavaScript лише записав код на сторінку.