2 ybdt1201 ybdt1201 于 2016.04.08 20:00 提问

求大神解释下previoussibling与previouselementsibling

查了下previoussibling的解释:
返回列表项的 previousSibling(前一个同胞节点);
查了下previoussibling的解释:
previousElementSibling //前一个兄弟元素。
这样看起来二者应该是相同意义;
然而我在写代码的时候,发现用previousElementSibling可以捕捉到前一个同胞节点,
用previoussibling却不能?
所以想问下这两者是不是相同的,如果不同有什么区别

3个回答

perhapschen
perhapschen   2016.04.09 09:09

你把下面这一段运行一下就明白了,previousSibling指的是包含**文本节点**的上一个兄弟节点,而previousElementSibling指的是上一个兄弟元素节点

 <div id='div1'></div>
<div id='div2'></div>
<div id='div3'></div>

<script>

var o = document.getElementById("div2").previousSibling;
var p = document.getElementById("div2").previousElementSibling;
console.log(o);
console.log(p);

</script>
devmiao
devmiao   Ds   Rxr 2016.04.09 06:06
Ruanderen
Ruanderen   2017.07.27 10:17

previoussibling获取的兄弟节点是所有节点,包括文本节点;
previouselementsibling获取的的兄弟节点是元素节点,所以用的时候要区分了;

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
previousSibling、previousElementSibling的区别
previousSibling:获取元素的上一个兄弟节点;(既包含元素节点、文本节点、注释节点) div id="box"> ul id="ul"> li>第一个li> li id="one">第二个li> li>第三个li> ul> p>我是第二个子节点p> div> var one = docume
js学习及兼容性整理(一)
1、childNodes兼容性问题         用Children替换 2、兼容性问题      var oUL=document.getElementById("ul1");        var oFirst=oUL.firstChild||oUL.firstElementChild;        var oLast=oul.lastChild||oUL.lastElement
JS,nextSibling,nextElementSibling 下一个兄弟,previousSibling previousElementSibling 上一个兄弟节点
234 234 234 234 234 234 234 234 var div1 = document.getElementById("div1"); // div1.nextSibling.style.color="red";  获取下一个兄弟节点 只有IE 6 7 8兼容 // div1.nextElementSibling.style.color="red";   其
previousSibling和nextSibling用法
firstChild,lastChild,nextSibling,previousSibling都会将空格或者换行当做节点处理,但是有代替属性所以为了准确地找到相应的元素,会用firstElementChild,lastElementChild,nextElementSibling,previousElementSibling兼容的写法,这是JavaScript自带的属性。但坏消息是IE6,7,8
js的 nextsibling 和previousSibling
二者获取的是节点 而节点在js中有三种 元素节点 属性节点 文本节点 若两个标签之间存在空格,如 空格 则使用该方法获取的节点会获取到文本节点 为什么? 因为空格算是文本节点。 原因是 nextsibling 和previousSibling获取的是节点!!!!
js nextSibling属性和previousSibling属性和NodeType返回类型
1:nextSibling属性         该属性表示当前节点的下一个节点(其后的节点与当前节点同属一个级别);如果其后没有与其同级的节点,则返回null。        需要特别注意的是:该属性在不同的浏览器中的执行结果并不都相同,见下面例示:       先来看一个例子:     view plaincopy to clipboardpr
js DOM的previousSibling 和 nextSibling
<br />原来地址:http://blog.csdn.net/lin49940/archive/2009/10/26/4728125.aspx<br /> <br />定义和用法<br />nextSibling 属性可返回某个元素之后紧跟的节点(处于同一树层级中)。<br />如果无此节点,则该属性返回 null。语法:view plaincopy to clipboardprint?nodeObject.nextSibling  previousSibling 属性可返回某节点之前紧跟的节点(处于同一
在ie8 previousSibling.textContent undefined 解决
在ie8下 var text=inputObj.previousSibling.textContent;      text为‘undefined ’ html为:Coffee Tea原因:元素内的空白字符被视作文本,而文本被视作节点。 请在两个 元素之间添加空格,结果将是 "undefined"。 html为: CoffeeTea 这样又正常。 解决: $("#"+i
previousSibling 使用问题
在使用 previousSibling 获取某个元素的上一个兄弟节点时,节点之间不应存在有空格,否则会报错。 无标题文档 window.onload=function(){ var oLi=document.getElementById('li1'); oLi.previousSibling.style.background='red'; }
关于Csharp通过url下载的问题
为什么documentComplete 就是不起作用呢?为什么反复的循环呢?求大神解释下