previoussibling 和 previouselementsibling 的区别-javascript
Difference between previoussibling and previouselementsibling-javascript
不知是否知道javascriptprevioussibling和previouselementsibling有什么区别。我试过了,但没有找到任何比较或描述这个的问题或文章。也许这是我的小知识javascript,但如果能解释一下,我将不胜感激。
非常感谢。
previousElementSibling
属性 returns 指定元素的前一个元素,在同一树级别。
这个属性和previousSibling
的区别在于previousSibling
returns前一个兄弟节点作为元素节点,文本节点或者注释节点, while previousElementSibling
returns 前一个兄弟节点作为元素节点(忽略文本和注释节点)。
//Get the second li element
var liElement = document.getElementById( "target" ) ;
//Get the previous element (→ Text node (line feed and tab character))
var previousSibling = liElement.previousSibling ;
console.log("previousElementSibling::"+previousSibling.data);
console.log("previousSibling.previousElementSibling::",previousSibling.previousElementSibling);
//Get the previous element (→ <li> Element 3 </ li>)
var previousElementSibling = liElement.previousElementSibling ;
console.log("previousElementSibling::",previousElementSibling);
<ul>
<li>Element-1</li>↓
<li id="target">Element-2</li>
<li>Element-3</li>
</ul>
不知是否知道javascriptprevioussibling和previouselementsibling有什么区别。我试过了,但没有找到任何比较或描述这个的问题或文章。也许这是我的小知识javascript,但如果能解释一下,我将不胜感激。
非常感谢。
previousElementSibling
属性 returns 指定元素的前一个元素,在同一树级别。
这个属性和previousSibling
的区别在于previousSibling
returns前一个兄弟节点作为元素节点,文本节点或者注释节点, while previousElementSibling
returns 前一个兄弟节点作为元素节点(忽略文本和注释节点)。
//Get the second li element
var liElement = document.getElementById( "target" ) ;
//Get the previous element (→ Text node (line feed and tab character))
var previousSibling = liElement.previousSibling ;
console.log("previousElementSibling::"+previousSibling.data);
console.log("previousSibling.previousElementSibling::",previousSibling.previousElementSibling);
//Get the previous element (→ <li> Element 3 </ li>)
var previousElementSibling = liElement.previousElementSibling ;
console.log("previousElementSibling::",previousElementSibling);
<ul>
<li>Element-1</li>↓
<li id="target">Element-2</li>
<li>Element-3</li>
</ul>