Документ HTML DOM на JavaScript

Объект Document HTML DOM является владельцем всех других объектов на вашей веб-странице.

Объект Document HTML DOM

Объект документа представляет ваш веб-страницу.

Если вы хотите получить доступ к любому элементу HTML-страницы, то всегда начинайте с доступа к объекту document.

Ниже приведены примеры того, как использовать объект document для доступа и операции с HTML.

Найти HTML элемент

Метод Описание
document.getElementById(id) По идентификатору элемента находить элементы
document.getElementsByTagName(Имя) По имени тега находить элементы
document.getElementsByClassName(Имя) По имени класса находить элементы

Изменение HTML элемента

Метод Описание
element.innerHTML = Новый html контент Изменение inner HTML элемента
element.attribute = new value Изменить значение атрибута элемента HTML
element.setAttribute(attribute, value) Изменить значение атрибута элемента HTML
element.style.property = new style Изменить стиль элемента HTML

Добавление и удаление элементов

Метод Описание
document.createElement(element) Создать элемент HTML
document.removeChild(element) Удалить элемент HTML
document.appendChild(element) Добавить элемент HTML
document.replaceChild(element) Заменить элемент HTML
document.write(text) Записать в поток HTML-вывода

Добавить обработчик событий

Метод Описание
document.getElementById(id).onclick = function(){code} Добавить обработчик событий к событию onclick

Найти объект HTML

Первый HTML DOM Level 1 (1998) определил 11 объектов HTML, наборов объектов и атрибутов. Они по-прежнему актуальны в HTML5.

Позднее, в HTML DOM Level 3, были добавлены дополнительные объекты, наборы и атрибуты.

Атрибуты Описание DOM
document.anchors Возврат всех элементов <a> с атрибутом name. 1
document.applets Возврат всех элементов <applet>(HTML5 не рекомендуется использовать) 1
document.baseURI Возврат абсолютного базового URI документа 3
document.body Возврат элемента <body> 1
document.cookie Возврат cookie документа 1
document.doctype Возврат doctype документа 3
document.documentElement Возврат элемента <html> 3
document.documentMode Возврат режима, используемого браузером 3
document.documentURI Возврат URI документа 3
document.domain Возврат доменного имени сервера документа 1
document.domConfig Устарел.Возврат конфигурации DOM 3
document.embeds Возврат всех элементов <embed> 3
document.forms Вернуть все элементы <form> 1
document.head Вернуть элемент <head> 3
document.images Вернуть все элементы <img> 1
document.implementation Вернуть реализацию DOM 3
document.inputEncoding Вернуть кодирование документа (charset) 3
document.lastModified Вернуть дату и время обновления документа 3
document.links Вернуть все элементы <area> и <a> с атрибутом href 1
document.readyState Вернуть состояние документа (загрузка) 3
document.referrer Вернуть URI ссылки (документ) 1
document.scripts Вернуть все элементы <script> 3
document.strictErrorChecking Вернуть, выполняется ли принудительная проверка ошибок 3
document.title Вернуть элемент <title> 1
document.URL Вернуть полный URL документа 1