DOM (Document Object Model) - це інтерфейс програмування, який надає структуроване представлення документів, таких як HTML, XHTML або XML, у вигляді дерева об’єктів. DOM дозволяє програмам та скриптам змінювати структуру, стиль та вміст веб-сторінок.
Основні концепції DOM
-
Документ - це основний об’єкт, який представляє всі інші елементи веб-сторінки. Документ є вихідним пунктом для навігації та взаємодії з DOM.
-
Елементи є складовими частинами веб-сторінки, такими як теги
<div>
,<p>
,<span>
тощо. Вони можуть містити інші елементи, текст або атрибути. -
Атрибути забезпечують додаткову інформацію про елементи. Наприклад, у тега
<img>
атрибутsrc
вказує шлях до зображення. -
Текстові вузли - це текстовий вміст всередині елементів. Наприклад, текст між тегами
<p>
і</p>
є текстовим вузлом. -
Колекції і колекції Node. DOM надає зручні засоби для роботи з групами елементів або текстових вузлів. Наприклад, ви можете отримати всі елементи з певним тегом або класом.
-
Методи і властивості. DOM надає набір методів і властивостей для взаємодії з елементами, текстовими вузлами та атрибутами. Ці методи дозволяють змінювати вміст, стилі, атрибути тощо.
-
Навігація. DOM дозволяє легко навігувати між елементами та їхніми батьківськими, дочірніми та сусідніми елементами в дереві.
-
Події. DOM дозволяє прикріплювати обробники подій до елементів, таких як кліки мишею або натискання клавіші. Це дозволяє реагувати на дії користувача на сторінці.
DOM є ключовою частиною веб-розробки, оскільки він дозволяє динамічно змінювати зміст та структуру веб-сторінок за допомогою JavaScript або інших мов програмування. Він є потужним інструментом для створення інтерактивних та динамічних веб-додатків.