English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

HTML DOM children 属性

Objeto Elemento de HTML DOM

children子属性返回一个活动的HTMLCollection,它包含指定父元素的所有子元素。

集合中的元素按照它们在源代码中出现的顺序进行排序。

您可以使用索引号访问集合中的各个子元素,并且索引从0开始。

使用length属性确定子元素的数量,然后可以遍历所有子元素。

注意:如果父元素没有子元素,则子元素是一个长度为0的空列表。

此属性与childNodes之间的区别在于,childNodes包含所有节点,包括文本节点和注释节点,而子节点仅包含元素节点。

语法:

ParentElement.children
var list = document.body.children;
Prueba y mira‹/›

Compatibilidad del navegador

Los números en la tabla especifican la versión del navegador que admite completamente el atributo children:

Atributo
children13.51049

Detalles técnicos

Valor de retorno:Objeto HTMLCollection en tiempo real que representa la colección de nodos de elementos
Versión DOM:Nivel DOM1

Más ejemplos

Encontrar cuántos elementos hijo tiene el elemento DIV:

var len = document.querySelector("div").children.length;
Prueba y mira‹/›

Cambiar el segundo elemento hijo (índice1] de color de fondo:

var parent = document.querySelector("div");
var list = parent.children;
list[1].style.backgroundColor = "coral";
Prueba y mira‹/›

Cambiar el texto del primer elemento hijo (índice 0) del elemento DIV:

var parent = document.querySelector("div");
var list = parent.children;
list[0].innerHTML = "HELLO WORLD";
Prueba y mira‹/›

Objeto Elemento de HTML DOM