HTML DOM nextSibling 屬性

HTML DOM Element 對(duì)象

nextSibling屬性返回元素節(jié)點(diǎn)之后緊跟的兄弟節(jié)點(diǎn)（包括文本節(jié)點(diǎn)、注釋節(jié)點(diǎn)即回車、換行、空格、文本等等）。

如果沒有下一個(gè)同級(jí)，則此屬性返回null。

空格被視為文本，文本被視為節(jié)點(diǎn)。注釋也被視為節(jié)點(diǎn)。

為了避免nextSibling返回#text或#comment節(jié)點(diǎn)的問題，可以使用nextElementSibling僅返回元素節(jié)點(diǎn)。

使用previousSibling屬性可以返回指定節(jié)點(diǎn)在同一樹級(jí)別中的上一個(gè)節(jié)點(diǎn)。

使用childNodes屬性可返回指定節(jié)點(diǎn)的任何子節(jié)點(diǎn)。

語法：

node.nextSibling

<div id="div-1">Here is div-1</div>
<div id="div-2">Here is div-2</div>

<script>
var x = document.querySelector("#div-1").nextSibling.nodeName;
document.getElementById("result").innerHTML = x;
</script>

但是，如果刪除DIV之間的空格，則返回值將不是#text：

<div id="div-1">Here is div-1</div><div id="div-2">Here is div-2</div>

<script>
var x = document.querySelector("#div-1").nextSibling.innerHTML;
document.getElementById("result").innerHTML = x;
</script>

瀏覽器兼容性

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

屬性
nextSibling	是	是	是	是	是

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

相關(guān)參考

HTML DOM參考：node .childNodes屬性

HTML DOM參考：node .firstChild屬性

HTML DOM參考：node .lastChild屬性

HTML DOM參考：node .parentNode屬性

HTML DOM參考：node .previousSibling屬性

HTML DOM參考：node .nodeName屬性

HTML DOM Element 對(duì)象