- •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.4. Сценарії, що працюють з об'єктами window
2.4.1. Як закрити вікно браузера
Треба вирішити задачу, неможливу без застосування файла сценарію як-от закрити головне вікно браузера за допомогою кнопки, розташованої в документі HTML.
Якщо натиснути на кнопку з назвою Close Navigator Window, сценарій відобразить на екрані діалогову панель.
Дана діалогова панель відображається за допомогою методу confirm. Якщо натиснути на кнопку ОК, сценарій спробує закрити вікно браузера за допомогою методу close.
Браузер Microsoft Internet Explorer версії 4.0 запитує дозвіл на закриття вікна ще разом.
Вихідний текст документа HTML, що закриває головне вікно браузера, поданий у листинге 2.3.
Листинг 2.3. Файл chapter2/CloseAll/CloseAll. html
<HEAD>
<Т1ТLЕ>Закриваємо вікно 6payзepa</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function CloseNavWnd()
{
if(confirm("Ви дійсно бажаєте закрити вікно браузера? "))
window.close();
}
//-->
</SCRIPT>
</HEAD>
<BODY BGCOLOR=white>
<Н1>Закриваємо вікно браузера</Н1>
<Р>Для того щоб закрити вікно браузера, натисніть кнопку "Close Navigator Window", розташовану нижче:
<FORM NAME="selectForm">
<P><INPUT TYPE="button" VALUE="Close Navigator Window"
onClick="CloseNavWnd();">
</FORM>
</BODY>
</HTML>
У області заголовка документа визначена функція CloseNavWnd:
function CloseNavWnd()
{
if{confirm("Ви дійсно бажаєте закрити вікно браузера?"))
window. close();
}
Ця функція обертається до методу confirm, що виводить на екран діалогову панель із запитом на закриття вікна. Якщо користувач натисне кнопку ОК, метод поверне значення true, а якщо на кнопку Cancel - значення false.
У випадку позитивної відповіді функція CloseNavWnd викликає метод close для поточного об'єкта window. У даному випадку таким об'єктом є вікно браузера. Замість об'єкта window можна вказувати об'єкт self, тому що це синонім поточного вікна:
self. close();
Для того щоб функція CloseNavWnd визивалася після того, як користувач натискає кнопку, у рядку визначення цієї кнопки зазначена оброблювач події onClick:
<P><INPUT TYPE="button" VALUE="Close Navigator Window"
onClick="CloseNavWnd();">
2.4.2. Открываем нове окно
При відкритті такого документа HTML на екрані з'являється діалогова панель із повідомленням.
Якщо натиснути на кнопку ОК у цій діалоговій панелі, то у вікні браузера з'явиться вміст документа.
У цьому вікні розташована кнопка Open Hello window. Якщо натиснути на цю кнопку, буде створене ще одне вікно браузера, у який завантажи_ уміст файла Hello.html. Проте зовнішній вигляд цього вікна буде декілька незвичний. У вікні немає ні смуг перегляду, ні меню, ні інструментальної лінійки - при створенні цього вікна в сценарії було зазначено, що перераховані вище елементи користувального інтерфейсу відображати не потрібно. Крім того, були визначені точні розміри вікна.
Якщо тепер закрити вікно документа NewWnd. html, на екрані з'явиться діалогова панель із запрошенням.
Вихідний текст документа HTML NewWnd. html поданий у листинге 2.4.
Листинг 2.4. Файл chapter2/NewWnd/NewWnd. html
<HTML>
<HEAD>
<TITLE>Window object</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
function Hello()
{
window.alert("Welcome to my home page!")
}
function Bye()
{
window.alert("Bye! Come back again!")
}
function OpenHelloWnd()
{
var wndNewWindow;
wndNewWindow = window.open("hello.html","", "toolbar=no,menubar=no,scrollbars=no,width=300,height-100");
}
//-->
</SCRIPT>
</HEAD>
<BODY BGCOLOR=white onLoad="Hello()" onUnload="Bye()">
<Hl>Open second window</Hl>
<FORM NAME="selectForm">
<P><INPUT TYPE="button" VALUE="Open Hello window"
onClick="OpenHelloWnd();">
</FORM>
</BODY>
</HTML>
У операторі <BODY> задане опрацювання події onLoad і onUnload:
<BODY BGCOLOR=white onLoad="Hello()" onUnload="Bye()">
Коли користувач завантажує документ, після закінчення завантаження браузер викликає функцію Hello, призначену для опрацювання події onLoad. Перед видаленням вікна з документом визивається оброблювач події onUnload, реалізований у функції Bye.
Функції Hello і Bye визначені в заголовку документа HTML і не мають ніяких особливостей. Для висновка діалогової панелі з повідомленням ці функції викликають метод alert.
Коли користувач натискає кнопку "Open Hello window", визначену у формі, визивається функція OpenHelloWnd. Ця функція відчиняє нове вікно браузера, завантажуючи в нього новий документ HTML.
Вікно відчиняється в такий спосіб:
wndNewWindow - window. open("hello. html", "", "toolbar-no,menubar=no,scrollbars=no,width=300,height=100");
У якості першого параметра методу open передається адреса URL документа HTML, що повинні бути завантажені у вікно. Другий параметр визначає ім'я вікна (його не задали), а третій - визначає параметри вікна.