HTML DOM children 属性
页面下方有更多实例。
定义和用法
children 属性以 HTMLCollection 对象的形式返回元素子元素的集合。
集合中的元素按其在源代码中的显示进行排序,可以通过索引号进行访问。索引从0开始。
提示: 可以使用 HTMLCollection 对象的 length 属性来确定子元素的数量,然后可以循环遍历所有子元素并提取所需的信息。
此属性与 childNodes 之间的区别在于,childNodes 包含所有节点,包括文本节点和注释节点,而子节点仅包含元素节点。
浏览器支持
表中的数字表示支持该属性的第一个浏览器版本。
属性 | |||||
---|---|---|---|---|---|
children | 2.0 | 9.0* | 3.5 | 4.0 | 10.0 |
*注意: IE6 到 IE8 完全支持 children 属性。然而,在这些版本中,它返回元素节点和注释节点。IE9+ 只返回元素节点。
语法
element.children
技术细节
返回值: | 一个活动的 HTMLCollection 对象,表示元素节点的集合。返回集合中的元素按其在源代码中的显示进行排序 |
---|---|
DOM 版本 | Core Level 1 Element Object |
更多实例
实例
更改 <div> 元素的第二个子元素的背景色:
var c = document.getElementById("myDIV").children;
c[1].style.backgroundColor = "yellow";
亲自试一试 »
实例
获取 <select> 元素的第三个子元素(索引2)的文本:
var c = document.getElementById("mySelect").children[2].text;
亲自试一试 »
实例
循环浏览 <body> 的所有子对象,并将其背景色更改为红色:
var c = document.body.children;
var i;
for (i = 0; i < c.length; i++) {
c[i].style.backgroundColor = "red";
}
亲自试一试 »
相关页面
HTML DOM 参考手册: childNodes 属性