Дочерние узлы элемента HTML DOM
Объект элементаПример
Получите дочерние узлы элемента <body>:
const nodeList = document.body.childNodes;
Ниже приведены дополнительные примеры.
Определение и использование
Свойство childNodesвозвращает коллекцию (список) дочерних узлов элемента.
Свойство childNodesвозвращает объект NodeList.
Свойство childNodesдоступно только для чтения.
Примечание
Пробелы внутри элементов рассматриваются как текстовые узлы.
Комментарии также считаются узлами.
childNodes[0]такое же, как firstChild.
Разница
Свойство childNodesвозвращает все дочерние узлы , включая текстовые узлы и узлы комментариев, а childrenсвойство возвращает только дочерние элементы .
Смотрите также:
Список узлов
NodeList — это коллекция (список) узловых объектов, подобная массиву.
NodeList имеет свойство длины , которое возвращает количество узлов в списке.
Доступ к узлам можно получить по порядковым номерам. Индекс начинается с 0.
Синтаксис
element.childNodes
Возвращаемое значение
| Тип | Описание |
| Объект | Коллекция узлов NodeList . Узлы сортируются по мере их появления в документе. |
Дополнительные примеры
Количество дочерних узлов в элементе <div>:
let numb = document.getElementById("myDIV").childNodes.length;
Измените цвет фона второго дочернего узла:
document.getElementById("myDIV").childNodes[1].style.backgroundColor = "yellow";
Получите текст третьего дочернего узла элемента <select>:
let text = document.getElementById("mySelect").childNodes[2].text;
Связанные страницы
Поддержка браузера
element.childNodesявляется функцией DOM уровня 1 (1998 г.).
Он полностью поддерживается во всех браузерах:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | 9-11 | Yes | Yes | Yes | Yes |
Объект элемента