获取相关节点:
1.获取ul var ulObj=my$("uu"); 2.第二个li var liObj=my$("show") 3.父级节点 console.log(ulObj.parentNode); 4.父级元素 console.log(ulObj.parentElement); 5.子级节点 console.log(ulObj.childNodes); 6.子级元素---不加element console.log(ulObj.children); console.log("==============================") 7.第一个子级节点 console.log(ulObj.firstChild); 8.第一个子级元素 console.log(ulObj.firstElementChild); 9.最后一个子级节点 console.log(ulObj.lastChild); 10.最后一个子级元素 console.log(ulObj.lastElementChild); 11.前一个兄弟节点 console.log(liObj.previousSibling); 12.前一个兄弟元素 console.log(liObj.previousElementSibling); 13.后一个兄弟节点 console.log(liObj.nextSibling); 14.后一个兄弟元素 console.log(liObj.nextElementSibling);
谷歌和火狐,都是支持获取对应的节点和元素,IE8:从第一个子级节点开始到兄弟节点,都支持通过获取节点的方式获取元素,获取元素的方式不支持
举例:
//获取任意父级元素的第一个子级元素
function getFirstElementChild(element) { if (typeof getFirstElementChild){ return element.firstElementChild; } else{ var node=element.firstChild; while (node && node.nodeType !=1){ node=node.previousSibling; } return node; } }
//获取任意父级元素的最后一个子级元素
function getLastElementChild(element) {
if (element.lastElementChild) {//支持
return element.lastElementChild;
} else {//不支持
var node = element.lastChild;
while (node && node.nodeType != 1) {
node = node.previousSibling;
}
return node;
}
}