JavaScript с нуля

Знакомьтесь с объектной моделью документа

То, что отображается в вашем браузере, является веб-документом. Если говорить более конкретно, суммируя материал предыдущих разделов, то вы видите то, что сформировано взаимодействием HTML, CSS и JavaScript. Если еще немного углубиться, то изнутри действует иерархическая структура, которую ваш браузер использует, чтобы разобраться во всем, что происходит.

Эта структура известна как объектная модель документа. Друзья зовут ее просто DOM. На рис. 24.3 показан упрощенный вид DOM для нашего предыдущего примера.

Рис. 24.3. DOM для всего HTML, приведенного в начале главы, выглядит примерно так

Несмотря на простоту, нужно разобрать кое-какие вещи, применимые ко всем структурам DOM. В действительности DOM кроме HTML содержит и многие другие компоненты. Все эти компоненты более широко известны как узлы.

Эти узлы могут быть элементами (что не должно вас удивлять), атрибутами, текстом, комментариями, документным материалом и чем-то еще, о чем вы даже и не задумываетесь. Эта деталь может быть для кого-то и важна, но не для нас с вами. Практически всегда единственным интересующим нас узлом будет элемент, так как именно с ними мы будем иметь дело в 99 % случаев. Хотя на скучном техническом уровне узлы по-прежнему играют определенную роль в нашем сконцентрированном на элементе представлении.

Каждый HTML-элемент, к которому вы хотите обратиться, имеет конкретный, ассоциированным с ним тип. Все эти типы расширяют основу Node (узел), которая представляет их все, как показано на рис. 24.4.

Рис. 24.4. Структурное расположение элементов, которые мы обычно видим

Ваши HTML-элементы находятся в конце цепочки, которая начинается с узла и продолжается Element и HTMLElement, заканчиваясь типом (HTMLDivElement, HTMLHeadingElement и т. д.), совпадающим с самим элементом. Свойства и методы, используемые для управления HTML-элементами, представлены в одной из частей этой цепочки.

Прежде чем перейти к использованию DOM для модифицирования HTML-элементов, давайте сначала поговорим о двух особых объектах, которые встают у нас на пути.