HTML DOM Element nextSibling 属性

定义和用法

nextSibling 属性返回同一树级别上的下一个节点。

nextSibling 返回的是 Node 对象。

nextSibling 属性是只读的。

注意

nextSibling 返回下一个同胞节点：元素节点、文本节点或注释节点。

元素之间的空白也是文本节点。

替代方案：

nextElementSibling 属性 - nextElementSibling 返回下一个同胞元素（忽略文本和注释）。

另请参阅：

previousSibling 属性

firstChild 属性

lastChild 属性

childNodes 属性

hasChildNodes() 方法

HTML 节点与元素

在 HTML DOM（文档对象模型）中，HTML 文档是拥有（或没有）子节点的节点集合。

节点指的是元素节点、文本节点和注释节点。

元素之间的空白也是文本节点。

而元素只是元素节点。

同胞与元素同胞

同胞是“兄弟”和“姐妹”。

同胞是拥有相同父节点的节点（在相同的 childNodes 列表中）。

元素同胞是拥有相同父元素的元素（在相同的 children 列表中）。

子节点与子元素

childNodes 返回子节点（元素节点、文本节点和注释节点）。

children 返回子元素（而非文本和注释节点）。

nextSibling 与 nextElementSibling

nextSibling 返回下一个节点（元素节点、文本节点或注释节点）。元素之间的空白也是文本节点。

nextElementSibling 返回下一个元素（不返回文本和注释节点）。

previousSibling 与 previousElementSibling

previousSibling 返回上一个节点（元素节点、文本节点或注释节点）。元素之间的空白也是文本节点。

previousElementSibling 返回上一个元素（不返回文本和注释节点）。

实例

返回列表项的下一个同胞的 HTML 内容：

document.getElementById("item1").nextSibling.innerHTML;

亲自试一试

语法

element.nextSibling

或

node.nextSibling

返回值

类型 描述
节点 元素的下一个同胞。
null 如果不存在下一个同胞。

浏览器支持

element.nextSibling 是 DOM Level 1 (1998) 特性。

所有浏览器都完全支持它：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
支持 9-11 支持 支持 支持 支持