Javascript nextElementSibling和nextSibling有什么区别

虽然我偶尔会得到奇怪的结果，但在我看来，这些结果似乎是相同的，所以有人能描述它们之间的区别吗？

'nextSibling'返回下一个节点对象，而'nextElementSibling'返回下一个元素对象，所以真正的问题可能是节点和元素之间的区别是什么

基本上，元素由HTML标记指定，而节点是DOM中的任何对象，因此元素是节点，但节点也可以包括空白、注释、文本字符或换行符形式的文本节点。有关元素与节点的更多信息，请参见

i、 e获取以下DOM片段

<div id="start"></div>
Me
<p>Hi</p>

我
嗨

使用nextSibling，您将获得：

console.log(document.getElementById('start').nextSibling); // "\nMe\n"
console.log(document.getElementById('start').nextSibling.nextSibling); // "<p>

console.log(document.getElementById('start').nextElementSibling);// "<p>"

console.log（document.getElementById（'start'）.nextSibling）；//“\nMe\n”
console.log（document.getElementById（'start'）.nextSibling.nextSibling）；//“

而使用nextElementSibling，您将获得：

console.log(document.getElementById('start').nextSibling); // "\nMe\n"
console.log(document.getElementById('start').nextSibling.nextSibling); // "<p>

console.log(document.getElementById('start').nextElementSibling);// "<p>"

console.log（document.getElementById（'start'）.nextElementSibling）；/“”

---

另外，nextElementSibling是IE10+，是一种较新的方法，而nextSibling具有完全的浏览器支持

nextSibling

将返回DOM中的下一个节点，最有可能是在当前的网页场景中，它是一个空白，但是

nextElementSibling

将只返回下一个元素，忽略其间的所有节点（如果有的话）

关于当前页面。问题的

下一个sibling

是一个

文本节点（空白）

，但是如果我想得到

#答案

我将使用

下一个主题同级

---

空白是文本。它的含义不止于此。节点的类型存储为属性。元素的节点类型为1，其他11个（请参阅）。并且DOM适用于HTML以外的文档。好的，谢谢，这很有意义，所以nextElementSibling似乎是我的最佳选择，因为我正在构建>IE10。这是否回答了您的问题？