❗ Вебсайт в стадии бета-тестирования. Возможны ошибки.

Объектная модель вебстраницы

Совет

Модель вебстраницы DOM не существует сама по себе. Она совместно с моделью стилей CSSOM участвует в создании модели представления вебстраницы.

Назначение модели

Объектная модель вебстраницы (Document Object Model, DOM) — это программный интерфейс (API) вебстраницы (гипертекста). DOM предоставляет методы и свойства, которые позволяют взаимодействовать с объектами гипертекста.

Модель представляет вебстраницу в виде дерева объектов. Это позволяет языкам программирования оперировать содержимым и структурой вебстраницы.

Процесс построения объектной модели

Рассмотрим подробно процесс построения браузером пользователя объектной модели вебстраницы.

1. Получить поток байтов

  1. Пользователь в адресной строке браузера или в гиперссылке запрашивает вебстраницу.
  2. Браузер запрашивает вебсервер, на котором расположены необходимые файлы, и получает от вебсервера поток байтов.

2. Преобразовать байты в символы

  1. Браузер в соответствии с кодировкой UTF-8 преобразует поток байтов в строки символов Юникода.

3. Преобразовать символы в токены

  1. Браузер использует правила спецификации HTML и идентифицирует в строках символов токены узлов.

4. Преобразовать токены в объекты

  1. Браузер преобразует токены узлов в объекты гипертекста.

5. Построить объектную модель

  1. Браузер использует правила спецификации DOM и структурирует объекты в модель вебстраницы. HTML разметка помогает установить связи между узлами.

Результатом процесса служит объектная модель вебстраницы (DOM).

Каждый раз получая поток байтов браузер выполняет один и тот же процесс преобразования байтов в объектную модель. Чем сложнее структура вебстраницы, тем больше времени необходимо браузеру на построение модели узлов.

Отсюда вывод: на этапе проектирования необходимо насколько это возможно упрощать структуру вебстраницы. Это уменьшит количество ошибок при построении объектной модели и ускорит загрузку вебстраницы.

Объектная модель вебстраницы

Процесс создания объектной модели вебстраницы