Динамический HTML
Консорциум W3C (http://www.w3.org/dom) определяет DHTML как спецификацию открытой объектной модели, которая обеспечивает полный доступ к документу и позволяет свободно манипулировать всем документом и его содержимым. Все элементы документа являются программируемыми объектами, управляемыми событиями мыши и клавиатуры. Благодаря DHTML такие операции, как добавле-
ние содержимого, изменение какой-либо части Web-страницы, не требуют обращения к серверу и перезагрузки страницы. DHTML расширяет возможности традиционного HTML, ориентированного в основном на оформление страниц, позволяет создавать страницы, которые могут в интерактивном режиме взаимодействовать с пользователем.
Одной из особенностей языка JavaScript является то, что на стороне клиента
язык интегрирован с функциями браузера. Достигается это благодаря тому, что объектная модель браузера строится по принципу совместимости с объектной моделью JavaScript.
Все объекты браузера организованы в иерархическую структуру (рис. 1.1). Поскольку основные функции браузера реализуются в окне приложения, в котором отображается сам HTML-документ, центральным объектом иерархии является окно браузера. Оно представляется объектом window. Все другие объекты HTML рассматриваются как свойства этого объекта. На основе window можно определить объекты, свойства и методы, необходимые для полноценной работы с документами. Объекту window подчинены объекты следующего уровня, которые можно разделить на две группы:
объекты браузера, предоставляющие доступ к свойствам, методам и событиям, происходящим в окне браузера:
events; history; location; navigator; screen;
объекты документа и фреймов, позволяющие управлять элементами документов
и фреймов, загруженных в браузер:
document;
frames.
Вторая группа объектов вместе с содержащимися в ней свойствами, методами и событиями образует объектную модель документа DOM (Document Object Model). Это все, что пользователь видит в окне документа: текст, ссылки, рисунки и т. д.
Для эффективного управления содержимым блоков HTML-страниц и их оформлением необходимо хорошо представлять себе иерархию объектов объектной модели. Вверху иерархии расположен самый старший класс window. Атрибуты и свойства этого класса относятся, как правило, ко всему окну в целом. Доступ к подчиненным классам и далее к семействам, элементам и атрибутам элементов осуществляется через dot-нотацию, т. е. через точку, как во многих объектноориентированных языках, например:
window.document.forms
// все элементы семейства форм документа
Внутри объекту присваивается порядковый номер и может быть присвоено имя (идентификатор). Нумерация начинается с нуля (листинг 1.1).
Рис. 1.1. Объектная модель
Листинг 1.1
window.document.forms[0]
// первая форма семейства форм
window.document.forms.form1
// форма семейства форм form1 window.document.forms.form1.elements.elements[1]
// второй элемент формы form1 window.document.forms.form1.elements.input1
// элемент input формы form1
Для изменения атрибутов HTML-элементов, необходимо указать путь к этому элементу и установить значение необходимого атрибута:
window.document.forms.form1.elements.input1.value="Значение 1"; window.document.forms.form1.elements.input1.style.color="red"; window.document.forms.form1.elements.input1.size=10;
Если элементу присвоен уникальный идентификатор (ID), доступ к элементу можно получить через ID:
window.document.getElementById("div1").style.display="none"; window.document.getElementById("div1").style.color="green";
В записи через dot-нотацию допускается опускать window, при этом запись будет относиться к текущему окну.
Источник: Петин В. А., Сайт на AJAX под ключ. Готовое решение для интернет-магазина. — СПб.: БХВ-Петербург, 2011. — 432 с.: ил. + CD-ROM — (Профессиональное программирование)
Похожие посты:
- Оформление текста и другие базовые возможности (0)
- Избавление от переносов строки и потери места на странице (0)
- Что такое режим совместимости и как его избежать (0)
- Уход от наиболее распространенных ошибок в Internet Explorer 6 и 7 (0)
- Позиционирование элемента на странице с помощью CSS (0)
- Справочник по API доступа к базе данных Django - ЧАСТЬ 3 (0)
- Справочник по обобщенным представлениям Django (0)