HTML DOM children 屬性

HTML DOM Element 對(duì)象

children子屬性返回一個(gè)活動(dòng)的HTMLCollection，它包含指定父元素的所有子元素。

集合中的元素按照它們?cè)谠创a中出現(xiàn)的順序進(jìn)行排序。

您可以使用索引號(hào)訪問集合中的各個(gè)子元素，并且索引從0開始。

使用length屬性確定子元素的數(shù)量，然后可以遍歷所有子元素。

注意：如果父元素沒有子元素，則子元素是一個(gè)長度為0的空列表。

此屬性與childNodes之間的區(qū)別在于，childNodes包含所有節(jié)點(diǎn)，包括文本節(jié)點(diǎn)和注釋節(jié)點(diǎn)，而子節(jié)點(diǎn)僅包含元素節(jié)點(diǎn)。

語法：

ParentElement.children

var list = document.body.children;

瀏覽器兼容性

表格中的數(shù)字指定了完全支持children屬性的第一個(gè)瀏覽器版本：

屬性
children	1	3.5	10	4	9

技術(shù)細(xì)節(jié)

更多實(shí)例

找出DIV元素有多少個(gè)子元素：

var len = document.querySelector("div").children.length;

更改DIV元素的第二個(gè)子元素（索引1）的背景色：

var parent = document.querySelector("div");
var list = parent.children;
list[1].style.backgroundColor = "coral";

更改DIV元素的第一個(gè)子元素（索引0）的文本：

var parent = document.querySelector("div");
var list = parent.children;
list[0].innerHTML = "HELLO WORLD";

HTML DOM Element 對(duì)象