Вступ до DOM

• Квітня 28, 2024

DOM - абревіатура для Document Object Model. Це спосіб перегляду HTML, який дозволяє розробникам веб-сайтів створювати функції та маніпулювати кодом способами, які в іншому випадку були б неможливі.

Існує три основні типи DOM; основний DOM, який можна використовувати для визначення будь-якого документа незалежно від типу; XML DOM, який використовується з XML-документами, та HTML DOM. Цей останній тип є найважливішим і корисним для розробників HTML, тому саме цей DOM вивчить цю статтю.

HTML DOM розділяє сторінку HTML вгору на вузли. Усі ці вузли з'єднані один з одним, дочірні вузли спускаються від батьківських вузлів та від кореневого вузла вгорі, у вигляді дерева. Що робить DOM таким важливим і корисним для розробників HTML, це те, що це визначення відрізняє кожну частину сторінки та розміщує її по відношенню до всіх інших частин, так що легко спроектувати код, що посилається на цей конкретний розділ, і впливає лише на цю частину . Це робить HTML DOM життєво важливим для програмування Javascript, наприклад, оскільки він забезпечує спосіб програми Javascript безпосередньо використовувати елементи HTML. Без DOM неможливо, щоб програма Javascript динамічно отримувала доступ до вмісту веб-сторінки. В якості одного прикладу, використовуючи методи DOM, ви можете написати програму, яка змінює текст всередині певного елемента HTML, якщо відбувається конкретна подія (скажімо, відвідувач натискає кнопку на сторінці).

Як ви вже знаєте, HTML-сторінка складається з різних елементів на кшталт цього:



Зразок HTML-сторінки

Це приклад основної HTML-сторінки.

У DOM кожен елемент (усе між одним набором тегів, наприклад) - це вузол. Вузол називається кореневим вузлом і є найосновнішим; він має два дочірні вузли, вузол і вузол. У наведеному вище прикладі вузол є дочірнім вузлом і

вузол - це дочірній вузол.

Веб-розробник може використовувати та змінювати DOM за допомогою певних команд. Ці команди поділяються на властивості (які описують частину сторінки HTML) та методи (які щось роблять на цій частині сторінки).

Детальні відомості про використання HTML DOM див. У наступній статті "Робота з DOM", яка буде розміщена на наступному тижні.

Відео Інструкція: Вступ до JavaScript. Лекція 1 (частина 1) (Квітня 2024).