HTML DOM firstChild 屬性

HTML DOM Element 對象

firstChild只讀屬性返回指定節(jié)點的第一個子節(jié)點，作為一個Node對象。

如果指定的節(jié)點沒有子節(jié)點，則此方法將返回空值。

元素內(nèi)部的空白被視為文本，而文本被視為節(jié)點。注釋也被視為節(jié)點。

為了避免firstChild返回#text或#comment節(jié)點的問題，可以使用firstElementChild僅返回第一個元素節(jié)點。

要返回指定節(jié)點的最后一個子節(jié)點，請使用lastChild屬性。

語法：

node.firstChild

<div>
   <p>這是DIV里面的第1個P</p>
   <p>這是DIV里面的第2個P</p>
   <p>這是DIV里面的第3個P</p>
</div>

<script>
var x = document.querySelector("div").firstChild.nodeName;
document.getElementById("result").innerHTML = x;
</script>

但是，如果我們刪除DIV和第一個P元素之間的空格，則返回值將是P標(biāo)簽而不是#text：

<div><p>這是DIV里面的第1個P</p>
   <p>這是DIV里面的第2個P</p>
   <p>這是DIV里面的第3個P</p>
</div>

<script>
var x = document.querySelector("div").firstChild.nodeName;
document.getElementById("result").innerHTML = x;
</script>

瀏覽器兼容性

所有瀏覽器完全支持firstChild屬性：

屬性
firstChild	是	是	是	是	是

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

相關(guān)參考

HTML DOM參考：node .lastChild屬性

HTML DOM參考：node .childNodes屬性

HTML DOM參考：node .parentNode屬性

HTML DOM參考：node .nextSibling屬性

HTML DOM參考：node .previousSibling屬性

HTML DOM參考：node .nodeName屬性

HTML DOM Element 對象