什么是nextElementSibling和nextSibling之间的区别 [英] Whats the difference between nextElementSibling vs nextSibling

问题描述

虽然我似乎偶尔会得到奇怪的结果，但这些似乎与我相同，所以有人可以描述差异吗？

Although I seem to get strange results occasionally these seem to me to be the same so can someone describe the difference?

推荐答案

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

'nextSibling' returns the next Node object whereas 'nextElementSibling' returns the next Element object, so probably the real question is what is the difference between a Node & an Element?

基本上，元素由HTML标记指定，而节点是DOM中的任何对象，因此元素是节点，但节点也可以包含文本以空格，注释，文本字符或换行符形式的节点。有关元素与节点的详细信息，请参阅此节点对象与元素对象之间的区别？

Basically an Element is specified by an HTML Tag whereas a Node is any Object in the DOM, so an Element is a Node but a Node can also include Text Nodes in the form of whitespace, comments, text characters or line breaks. For more info on Elements vs Nodes see this Difference between Node object and Element object?

即采用以下DOM片段

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

使用nextSibling你会得到：

Using nextSibling you would get:

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

使用nextElementSibling你会得到：

Whereas using nextElementSibling you would get:

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

此外，nextElementSibling是IE10 +，是较新的方法，而nextSibling拥有完整的浏览器支持

Also nextElementSibling is IE10+, being the newer method whereas nextSibling has full browser support

这篇关于什么是nextElementSibling和nextSibling之间的区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！