- •1. Основні поняття
- •1.1. Сім варіацій на тему "Hello, world! "
- •1.1.1. Варіація перша: сама проста
- •1.1.2. Варіація друга: із секретним вихідним текстом
- •1.1.3. Варіація третя: із переменной і функціями
- •1.1.4. Варіація четверта: створення сторінки "на літу"
- •1.1.5. Варіація п'ята: із діалоговою панеллю
- •1.1.6. Варіація шоста: опрацювання події
- •1.1.7. Варіація сьома: із визначенням типу браузера
- •1.2. Перемінні в JavaScript
- •1.2.1. Оголошення перемінних
- •1.2.2. Присвоєння значення перемінним
- •1.2.3. Типи даних
- •1.2.4. Перетворення типів даних
- •1.3. Оператори мови JavaScript
- •1.3.1. Унарные оператори
- •1.3.2. Бинарные оператори
- •1.3.3. Оператори для роботи з окремими бітами
- •1.3.4. Оператори зсуву
- •1.3.5. Оператори відношення
- •1.3.6. Логічні оператори
- •1.3.7. Оператор присвоювання
- •1.3.8. Умовні оператори
- •1.3.9. Оператори циклу
- •1.3.10. Інші оператори
- •1.3.11. Старшинство операторів JavaScript
- •1.3.12. Функції в мові сценаріїв JavaScript
- •1.4. Приклади використання операторів циклу
- •2. Класи і об'єкти
- •2.1. Три типи об'єктів «JavaScript
- •2.1.1. Умонтовані об'єкти
- •2.1.2. Об'єкти браузера
- •2.1.3. Об'єкти на базі класів, утворюваних програмістом
- •2.2. Масиви в JavaScript
- •2.3.1. Властивості об'єкта window
- •2.3.2. Методи об'єкта window
- •2.4. Сценарії, що працюють з об'єктами window
- •2.4.1. Як закрити вікно браузера
- •2.4.2. Открываем нове окно
- •2.4.3. Текст , що біжить , у рядку стани браузера
- •2.4.4. Обмеження часу реакції користувача
- •2.4.5. Завантаження документа html у вікно браузера
- •2.5.1. Властивості об'єкта document
- •2.5.2. Методи об'єкта document
- •2.5.3. Колірне оформлення документа
- •2.5.4. Посилання і мітки в документі
- •2.6. Умонтований клас Math
- •2.6.1. Властивості
- •2.6.2. Методи
- •2.7. Умонтований клас Date
- •2.7.1. Конструктори класу Date
- •2.8. Умонтовані функції
- •2.9. Плавна зміна цвіту фона документа html
- •3. Робота з формами
- •3.1. Ієрархія об'єктів у формах
- •3.2. Форма і її властивості
- •3.2.2. Властивості об'єкта form
- •3.3. Об'єкти, що входять до складу форм
- •3.3.1. Кнопка button
- •3.3.2. Перемикач checkbox
- •3.3.3. Перемикач radio
- •3.3.4. Приклад форми з перемикачами
- •3.3.5. Список select
- •3.3.6. Приклади сценаріїв, що працюють із списками
- •3.3.7. Однострочное поле text
- •3.3.8. Перевірка анкети
- •3.3.9. Многострочное поле textarea
- •3.3.10. Приклад сценарію, що заповнює поле textarea
- •3.3.11. Однострочное поле password
- •3.3.12. Запровадження ідентифікатора і пароля
- •3.4. Перевірка заповнення форми
- •3.5. Шестнадцатеричный калькулятор
- •3.3.6. Електронні часи
- •4. Фреймы
- •4.1. Файл опису фреймов
- •4.2. Взаємодія між фреймами
- •4.2.1. Десятично-шестнадцатеричный перетворювач
- •4.2.2. Відображення декількох документів html
- •5. Растровые зображення
- •5.1. Растровое зображення як об'єкт
- •5.2. Динамічна заміна растровых зображень
- •5.2.1. Зміна зовнішнього вигляду графічних посилань
- •5.2.2. Створення анімаційних зображень
- •5.2.3. Чекання завантаження всіх зображень
- •6. Взаємодія з аплетами java
- •6.1. Вбудовування аплета Java у документ html
- •6.2. Виклик методів аплета Java із сценарію JavaScript
- •6.3. Доступ до полів аплета Java із сценарію JavaScript
- •6.4. Динамічне завантаження аплетов Java
- •7. Застосування cookie
- •7.1. Виконання основних операцій із cookie
- •7.1.1. Створення cookie
- •7.1.2. Одержання значення cookie
- •7.1.3. Зміна значення параметра cookie
- •7.1.4. Видалення cookie
- •7.1.5. Обмеження на використання cookie
- •7.2. Декілька прикладів використання cookie
- •7.2.1. Фіксація повторних провідин сторінки
- •7.2.2. Записна книжка Cookies Notepad
- •7.2.3. Настроювання параметрів документа html
- •7.2.5. Одержання cookie розширенням серверу Web
- •7.2.6. Лічильник провідин на базі cookie і програми cgi
- •7.3. Настроювання браузера для роботи з cookie
2. Класи і об'єкти
Мова сценаріїв JavaScript є об'єктно-орієнтованим. Об'єкти JavaScript являють собою набори властивостей і методів. Можна сказати, що властивості об'єктів - це дані, пов'язані з об'єктом, а методи - функції для опрацювання даних об'єкта.
Адресация властивостей у сценаріях JavaScript можлива або по іменах властивостей, або по їхніх номерах. Всі властивості об'єкта зберігаються як елементи масиву і тому кожна властивість має свій номер.
2.1. Три типи об'єктів «JavaScript
У мові JavaScript є три типи об'єктів: умонтовані об'єкти, об'єкти браузера й об'єкти, що програміст створює самостійно.
2.1.1. Умонтовані об'єкти
Нижче перераховані умонтовані об'єкти, властивості і методи яких доступні в сценаріях JavaScript без попереднього визначення цих об'єктів:
Об'єкт Опис
Array* Масив
Boolean* Логічні дані
Date Календарна дата
Function* Функція
Global* Глобальні методи
Math Математичні константи і функції
Number* Числа
Object* Об'єкт
String Рядки
Символом * відзначені умонтовані об'єкти, визначені в мові Microsoft JScript версії 3.0, реалізованої в браузере Microsoft Internet Explorer версії 4.0.
Як приклад, що має практичне значення, можна роздивитися документ HTML, у якому відображається поточна дата і час. Вихідний текст цього документа знаходиться в листинге 2.1.
Листинг 2.1. Файл chapter2/date/date. html
<HTML>
<HEAD>
<TITLE>Show date and time</TITLE>
</HEAD>
<BODY BGCOLOR=WHITE>
<Hl>Show date and time</Hl>
<SCRIPT LANGUAGE="JavaScript">
<!--
var dt;
var szDate="";
dt = new Date();
szDate = "Date: " + dt.getDate() + "."
+ dt.getMonth() + "." + dt.getYear();
document.write(szDate);
document.write("<BR>");
document.write("Time: " + dt.getHours()
+ ":" + dt.getMinutes() + ":" + dt.getSeconds());
//-->
</SCRIPT>
</BODY>
</HTML>
Тут сценарій JavaScript створює об'єкт Data, застосовуючи для цього ключове слово new і конструктор Date без параметрів:
var dt;
dt = new Date();
Утворюваний у такий спосіб об'єкт Data инициализируется поточною локальною датою, встановленої в користувача (а не на сервері Web, із якого був завантажений відповідний документ HTML).
У такому рядку формується текстовий рядок дати:
szDate = "Date: " + dt.getDate() + "."
+ dt. getMonth() + ". " + dt. getYear();
Значення календарного числа, номера місяця і роки тут утворюється відповідно за допомогою методів getDate, getMonth і getYear. Ці методи визиваються для об'єкта dt, що містить поточну дату.
Текстовий рядок дати виводиться в документ HTML за допомогою методу write, визначеного в об'єкті document:
document. write(szDate);
Об'єкт Date містить також інформацію про поточний час. Ця інформація витягається для відображення за допомогою методів getHours, getMinutes і getSeconds (відповідно часи, хвилини і секунди):
document. write("Time: " + dt. getHours()
+ ":" + dt. getMinutes() + ":" + dt. getSeconds());
2.1.2. Об'єкти браузера
З погляду сценарію JavaScript браузер рекомендується ієрархічно організованим набором об'єктів. Звертаючись до властивостей і методів цих об'єктів, можна виконувати різноманітні операції над вікном браузера, завантаженим у це вікно документом HTML, а також над окремими об'єктами, розміщеними в документі HTML.
У сценаріях JavaScript не можна створювати нові класи на базі класів, що відповідають цим об'єктам, проте властивості і методи об'єктів браузера доступні.
Ієрархія об'єктів браузера
Об'єкт window знаходиться в корені ієрархії. Коли у вікно браузера завантажується документ HTML, усередині цього об'єкта створюються інші об'єкти - document, parent, frame, location і top.
Якщо у вікно браузера завантажується документ HTML із фреймами, то для кожного фрейма створюється окреме вікно, причому це вікно створюється як об'єкт window.
Об'єкт document містить у собі інші об'єкти, склад яких цілком визначається документом HTML, завантаженим у вікно браузера. Це можуть бути форма, посилання на інші документи HTML або локальні посилання усередині одного документа, об'єкти, що визначають адресу URL документа, і т.д.
Форми в документі також рекомендуються у виді ієрархічного набору об'єктів. Об'єкт-форма може містити в собі такі об'єкти, як кнопки, перемикачі, поля для запровадження текстової інформації.
Звертаючись до властивостей перерахованих вище об'єктів, сценарій JavaScript може визначити різноманітні характеристики документа HTML. Йому доступні всього посилання, розміщені в документі, а також уміст поляж форм, визначених у документі HTML.
Події, пов'язані з об'єктами
З кожним об'єктом браузера зв'язується визначений набір подій, опрацювання яких можлива в сценарії JavaScript.
Наприклад, з об'єктом window пов'язані події onLoad і onUnload. Перше з цих подій виникає, коли браузер завершує завантаження вікна і всіх розташованих у ньому фреймов (якщо ці фреймы визначені у вікні). Друга подія виникає, коли користувач завершує роботу з документом, закриваючи вікно браузера або переключаючись на інший документ.