Больше "Try it Yourself" примеры ниже.
Определение и использование
Свойство детей возвращает коллекцию дочерних элементов Элемент, в качестве объекта HTMLCollection.
Элементы коллекции сортируются, как они появляются в исходном коде и могут быть доступны с помощью индексов. Индекс начинается с 0.
Совет: Вы можете использовать свойство длины объекта HTMLCollection , чтобы определить количество дочерних элементов, то вы можете перебрать все ребенок и извлекать информацию , которую Вы хотите.
Разница между этим свойством и ChildNodes , что ChildNodes содержит все узлы, включая текстовые узлы и узлы комментариев, в то время как дети содержат только узлы элементов.
Поддержка браузеров
Числа в таблице указать первую версию браузера, которая полностью поддерживает свойство.
| Имущество | |||||
|---|---|---|---|---|---|
| children | 2,0 | 9,0 * | 3,5 | 4,0 | 10,0 |
* Примечание: Свойство детей полностью поддерживается в IE6 на IE8. Однако, в этих версиях, она возвращает узлы элементов И узлы комментариев. IE9 + возвращает только узлы элементов.
Синтаксис
element .childrenТехнические подробности
| Возвращаемое значение: | Живой объект HTMLCollection, представляющий собой коллекцию узлов элементов. Элементы в возвращаемых коллекциях сортируются, как они появляются в исходном коде |
|---|---|
| DOM Version | Базовый уровень 1 Элемент объекта |
Еще примеры
пример
Узнайте, сколько детей <div> элемент имеет:
var c =
document.getElementById("myDIV").children.length;Результат будет с:
2 Попробуй сам " пример
Изменение цвета фона второго ребенка элемента <div> элемент:
var c = document.getElementById("myDIV").children;
c[1].style.backgroundColor = "yellow"; Попробуй сам " пример
Получить текст третьего элемента ребенка (index 2) из <select> элемента:
var c = document.getElementById("mySelect").children[2].text;Результат будет с:
Saab Попробуй сам " пример
Перебор всех детей <body> и изменить их цвет фона на красный:
var c = document.body.children;
var i;
for (i = 0; i < c.length; i++)
{
c[i].style.backgroundColor = "red";
} Попробуй сам " Похожие страницы
HTML DOM ссылка: childNodes Property