三、兄弟节点
1.previoursSibling
获取该节点的上一个兄弟元素。在IE浏览器中可以使用
2。previoursElementSibling
获取该节点的上一个兄弟元素。在非IE浏览器中可以使用
3.nextSibling
获取该节点的下一个兄弟元素。在IE浏览器中可以使用
4.nextElementSibling
获取该节点的下一个兄弟元素。在非IE浏览器中可以使用
解决浏览器的兼容
var oPrevious=oLi.previousElementSibling||oLi.previousSibling;
var oLast=oLi.nextElementSibling||oLi.nextSibling;
window.onload=function(){
var oLi=document.getElementById("li1");
var oPrevious=oLi.previousElementSibling||oLi.previousSibling;
oPrevious.style.background="red";
var oLast=oLi.nextElementSibling||oLi.nextSibling;
oLast.style.background="yellow";
}
上述代码实现将id为“li1”的上一个兄弟节点背景颜色设置为红色。下一个兄弟节点的背景颜色设置为黄色。
四、nodeName：节点的名称
元素节点的nodeName 与标签名相同
属性节点的nodeName 与属性名相同
文本节点的nodeName 始终是 #text
文档节点的nodeName 始终是 #document
五、nodeValue：节点值
元素节点的nodeValue 是 undefined 或 null
文本节点的nodeValue 是文本本身
属性节点的nodeValue 是属性值
nodeValue 属性对于文档节点和元素节点是不可用的。
console.log(oLi.nodeName); // LI
console.log(oLi.nodeValue);// null
