Структура документу dhtml
Створення інтерактивних сторінок
Концепція створення інтерактивних Web -страниц не є новою - компанії Microsoft і Netscape спочатку визначили просту об'єктну модель, яка була представлена як спосіб створення інтерактивних сторінок. При уважнішому розгляді об'єктна модель виявилася ефективнішою тільки для базової перевірки форм. Динамічний HTML забезпечує API, необхідний для повного управління HTML -документом. Більше не вимагається визначати сторінку під час завантаження. Після завантаження будь-яка частина сторінки може бути відразу ж змінена в динамічному режимі.
Здатність зміни документу і автоматичне переформатування документу є основним нововведенням, яке використовується в динамічному HTML. Традиційні браузери були засновані на інструментах переходу по документу, які відображували документ і потім чекали, поки користувач вибере новий документ. Коли вимагалося внести зміну до документу, для створення нової сторінки вирушав запит на сервер, який і генерував її на машині клієнта.
Мова програмування використовується для маніпулювання об'єктною моделлю динамічного HTML, але динамічний HTML розроблений як незалежний від платформи і мови програмування. Тому можуть бути використані мови програмування JavaScript, JScript, VBScript, C++, Java, а також інші мови.
Нові елементи DHTML:
1. Динамічний стиль. Таблиці стилів CSS документу можуть бути змінені в будь-який час. Документ не вимагається перезавантажувати з кеша або звертатися на сервер.
2. Динамічний зміст. Об'єктна модель дозволяє звертатися до вмісту документу і змінювати його.
3. Миттєва відповідь користувача. Динамічний HTML надає потужну нову модель подій, яка представляє усі призначені для користувача дії на сторінці.
Визначення HTML -документа
HTML є застосуванням мови SGML (Standard Generalized Markup Language - стандартна узагальнена мова розмітки). У документі HTML/SGML теги визначають структуру змісту документу.
Традиційний HTML/SGML -документ має три різні компоненти:
структура,
стиль;
зміст.
З введенням динамічного HTML був доданий четвертий компонент:
модель поведінки. Термін модель поведінки (behavior) визначає взаємодію між користувачем і HTML -страницей.
Об'єктна модель документу DHTML
Об'єктна модель документу визначає логічну структуру документу і спосіб доступу і маніпулювання його елементами. Усе, що визначено в документі тегами мови розмітки HTML -сторінки, стає доступним для зміни, видалення і додавання. Програміст може створювати документи, вільно переміщатися по їх структурі і додавати, змінювати або видаляти елементи і/або їх вміст. Цю техніку прийнято називати динамічним HTML.
Структура документу
У об'єктній моделі DHTML будь-який документ представляється у вигляді логічної деревовидної структури. Наступний фрагмент документу HTML :
<BODY>
<P ID='p1'> В блоковий елемент, яким є абзац
можна додавати <B ID='b1'>вбудовувані елементи</B>, яким
являється елемент IMG : <IMG ID='img1' SRC="my.gif">
</P>
<IMG ID='img2' SRC="my - 1.gif">
</BODY>
буде представлений в об'єктній моделі DHTML логічною структурою, показаною на малюнку, :
Мал. 1
Для складного документу логічна структура буде, природно, складніше. У ній може виявитися багато "дерев", які в сумі представлятимуть вже деякий "ліс".
Ієрархія об'єктів
Кожен об'єкт в ієрархії, об'єктною моделлю документу HTML, що надається, можна використовувати в сценарії JavaScript, але для цього необхідно дістати доступ до відповідного об'єкту.
У ієрархічній об'єктній моделі одну з важливих ролей при доступі до об'єктів грають два сімейства, що є властивостями будь-якого об'єкту HTML, - all і children. У першому знаходяться посилання на усі об'єкти, розташовані нижче за об'єкт в ієрархії, тоді як другою містить посилання на усі об'єкти, що безпосередньо породжуються даним.
На вершині усієї ієрархії об'єктів розташований об'єкт document, який "породжує" усі об'єкти, що представляють елементи HTML. Цей об'єкт також має властивість-сімейство all (сімейства children у нього немає), що містить посилання на усі об'єкти документу.