Методичні вказівки
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 лише записав код на сторінку.