Введение в DOM (Document Object Model) в JavaScript — это основа для манипулирования веб-страницами через JavaScript. DOM представляет собой иерархическое дерево объектов, которое описывает структуру и содержимое веб-страницы.

Каждый элемент на странице является узлом в DOM-дереве, а каждый узел имеет свойство и методы, которые можно использовать для доступа к его содержимому и стилям.

JavaScript может использоваться для обращения к элементам DOM, изменения их свойств и содержимого, добавления или удаления элементов из страницы, и т.д.

Чтобы начать работу с DOM в JavaScript, необходимо получить доступ к корневому элементу документа, используя свойство document. Затем можно использовать методы, такие как getElementById, getElementsByClassName или querySelector, чтобы получить ссылки на конкретные элементы на странице.

Пример использования метода getElementById:

// Получить ссылку на элемент с id="my-element"
var element = document.getElementById("my-element");

// Изменить содержимое элемента
element.innerHTML = "Новое содержимое";

Пример использования метода querySelector:

// Получить ссылку на первый элемент с классом "my-class"
var element = document.querySelector(".my-class");

// Изменить стиль элемента
element.style.color = "red";

DOM является основой для многих JavaScript-библиотек и фреймворков, таких как jQuery, React и Angular. Он также используется для создания интерактивных пользовательских интерфейсов, динамических эффектов и многого другого.