JavaScript HTML DOM

Через HTML DOM, JavaScript может доступа и изменять все элементы HTML документа.

HTML DOM (документ объектная модель)

Когда страница загружается, браузер создает документ объектной модели страницы (Document Object Model).

HTML DOM Модель структурирована какДерево объектов:

Дерево HTML DOM объекта

DOM HTML дерево

Через этот объектный модель, JavaScript получает все возможности для создания динамического HTML:

  • JavaScript может изменять все элементы HTML на странице
  • JavaScript может изменять все атрибуты HTML на странице
  • JavaScript может изменять все CSS-стили на странице
  • JavaScript может удалять существующие элементы и атрибуты HTML
  • JavaScript может добавлять новые элементы и атрибуты HTML
  • JavaScript может реагировать на все существующие HTML-события на странице
  • JavaScript может создавать новые HTML-события на странице

Что вы узнаете

В следующих главах этого руководства вы узнаете:

  • Как изменить содержимое элемента HTML
  • Как изменить стиль элементов HTML (CSS)
  • Как реагировать на события HTML DOM
  • Как добавить и удалить элементы HTML

Что такое DOM?

DOM - это стандарт W3C (World Wide Web Consortium).

DOM определяет стандарт доступа к документу:

“W3C Document Object Model (DOM) - это интерфейс, независимый от платформы и языка, который позволяет программам и скриптам динамически обращаться к содержимому, структуре и стилю документа.”

Стандарт W3C DOM разделен на 3 разные части:

  • Core DOM - стандарт модели документов всех типов
  • XML DOM - стандарт модели документа XML
  • HTML DOM - стандарт модели документа HTML

Что такое HTML DOM?

HTML DOM - это стандарт HTMLОбъектыМодели иПрограммный интерфейс. Оно определяет:

  • в качествеОбъектыHTML элементов
  • Все HTML элементыСвойства
  • Доступ ко всем свойствам HTML элементовМетоды
  • Все HTML элементыСобытия

Другими словами: HTML DOM - это стандарт, который описывает, как получить, изменить, добавить или удалить элементы HTML.