Все узлы HTML документа могут быть доступны посредством дерева, при этом их содержимое может быть изменено или удалено, а также можно добавить новые элементы.
Все узлы дерева находятся в иерархических отношениях между собой. Для описания этих отношений используются термины родитель, дочерний элемент и потомок. Родительские узлы имеют дочерние узлы, а дочерние элементы одного уровня называются потомками (братьями или сестрами).
В отношении узлов дерева соблюдаются следующие принципы:
- Самый верхний узел дерева называется корневым;
- Каждый узел, за исключением корневого, имеет ровно один родительский узел;
- Узел может иметь любое число дочерних узлов;
- Конечный узел дерева не имеет дочерних узлов;
- Потомки имеют общего родителя.
Программный интерфейс HTML DOM В рамках DOM модели HTML можно рассматривать как множество узловых объектов. Доступ к ним осуществляется с помощью JavaScript или других языков программирования. Программный интерфейс DOM включает в себя набор стандартных свойств и методов.
|
|
Свойства представляют некоторые сущности (например, <h1>), а методы - действия над ними (например, добавить <a>).
К типичным свойствам DOM относятся следующие:
- x. innerHTML – внутреннее текстовое значение HTML элемента x;
- x. nodeName – имя x;
- x. nodeValue – значение x;
- x. parentNode – родительский узел для x;
- x. childNodes – дочерний узел для x;
- x. attributes – узлы атрибутов x.
Узловой объект, соответствующий HTML элементу поддерживает следующие методы:
- x. getElementById (id) – получить элемент с указанным id;
- x. getElementsByTagName (name) – получить все элементы с указанным именем тэга (name);
- x. appendChild (node) – вставить дочерний узел для x;
- x. removeChild (node) – удалить дочерний узел для x.
Пример 3.
Для получения текста из элемента <p> со значением атрибута id " demo " в HTML документе можно использовать следующий код:
txt = document.getElementById("demo").innerHTML
Тот же самый результат может быть получен по-другому:
txt=document.getElementById("demo").childNodes[0].nodeValue