最新的Web開發教程
 

HTML DOM children Propery

<元素對象

獲取集合<body>元素的子項:

var c = document.body.children;
試一試»

更多"Try it Yourself"下面的例子。


定義和用法

Children屬性返回元素的子元素的集合,為的HTMLCollection對象。

當它們出現在源代碼中,並且可以通過索引號訪問的集合中的元素進行排序。 該指數從0開始。

提示:可以使用的HTMLCollection對象的長度屬性來確定子元素的數量,那麼你可以通過所有兒童循環,並提取所需的信息。

此屬性之間的差別的childNodes ,是的childNodes包含的所有節點,包括文本節點和註釋節點,而孩子們只包含元素節點。


瀏覽器支持

在表中的數字規定,完全支持該財產瀏覽器版本。

屬性
children 2.0 9.0 * 3.5 4 10.0

*注意:兒童屬性在IE6完全支持IE8。 然而,在這些版本中,它返回一個元素節點和註釋節點。 IE9 +只返回元素節點。


句法

element .children

技術細節

返回值: 一個活生生的HTMLCollection對象,表示元素節點的集合。 當它們出現在源代碼中返回的集合中的元素進行排序
DOM版本 核心1級元素對象

例子

更多示例

找出多少孩子<div>元素有:

var c = document.getElementById("myDIV").children.length;

C的結果將是:

2
試一試»

改變的第二子元件的背景顏色<div>元素:

var c = document.getElementById("myDIV").children;
c[1].style.backgroundColor = "yellow";
試一試»

得到所述第三子元素的文本(index 2) a的<select>元素:

var c = document.getElementById("mySelect").children[2].text;

C的結果將是:

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


<元素對象