调用节点有两个方法:IE6-8是用的firstchild,高版本的和chrome用的是firstElementChild来调用的,我们可以用和以前类似的方法,用if来判断,如果JoUl.firstElementChild存在,就用高版本的代码,如果不存在就用另外一套代码;

 

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script>
window.onload=function()
{
var oUl=document.getElementById('ul1')

if(oUl.firstElementChild)
{
oUl.firstElementChild.style.background='red'//如果oUl.firstElementChild存在,调用这个。
}
else
{
oUl.firstChild.style.background='red'//否则就用这个,oUl.firstChild
}
}
</script>
</head>
<body>
<div id="div1">
<ul id="ul1">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</body>
</html>

首位子节点:

  • firstChild和firseElementChild
  • lastChild和lastElementChild

兄弟节点:

  • nextSibling和nextElementSibling
  • preciousSilibling和preciousElementSibling

除了firstchild外还有别的几个节点同样的使用方法;