<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>兄弟节点previousSibling</title>
</head>
<body>
<ul id="ele">
<li id='li1'>前端开发课程</li>
<li id='li2'>javaScript课程</li>
<li id="li3">HTML5课程</li>
<li id="li4">CSS课程</li>
<li id="li5">其它网站开发经典课程</li>
<li id="li6">jQuery是其中的一部</li>
</ul>
</body>
<script type="text/ecmascript">
function previousSibling(ele) {
//先判断它支持不支持这个属性
if (typeof previousElementSibling == 'object') {
//如果支持直接返回return ele.previousElementSibling;
return ele.previousElementSibling;
} else {
//如果不支持就返回 ele.previousSibling
//元素的父节点
ele.previousSibling
//判断元素的哥哥节点,循环
do {
if (ele.previousSibling&&ele.previousSibling.nodeType=="1") {
return ele.previousSibling
}else{
ele = ele.previousSibling;
}
} while (ele)
return null;
}
}
var oLi1 = document.getElementById("ele").children[0];
var pre=previousSibling(oLi1)
alert(pre)//弹出null
//var oLi1 = document.getElementById("ele").children[1];
//var pre = previousSibling(oLi1)
//alert(pre)//弹出objectHTMLLIElement
</script>
</html>