Термины. Программный интерфейс HTML DOM

Все узлы 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


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: