节点之间的区别是什么?nextSibling和ChildNode.nextElementSibling

What is the difference between node.nextSibling and ChildNode.nextElementSibling?

本文关键字：nextSibling ChildNode nextElementSibling 是什么 之间 区别 节点      更新时间：2023-09-26

<div id="div-01">Here is div-01</div> <div id="div-02">Here is div-02</div>

它们不是一样的吗?

都返回紧跟其后的节点。我读了很多文章，但对我来说似乎是一样的，但不知道在哪里使用一个相对于另一个?

nextElementSibling总是返回一个元素。nextSibling可以返回任意类型的节点。它们在你的例子中是一样的，但在其他情况下是不同的，例如:

<p><span id="span-01">Here is span-01</span>
Some text at the top level
<span id="span-02">Here is span-02</span></p>

在这种情况下，document.getElementById('span-01').nextElementSibling是span-02，但document.getElementById('span-01').nextSibling是包含"顶层某些文本"的文本节点(或者，正如@ mango在评论中指出的，将该文本与上面元素分开的空白-似乎有些浏览器将元素和非空白节点之间的空白放在单独的节点中，而其他浏览器则将其与其余文本结合在一起)。

相关文章：