子节点和兄弟节点的操作
childNodes 属性
只读属性，子节点列表集合
其他浏览器(标准下)：包含了文本和元素类型的节点，也会包含非法嵌套的子节点
ie8以下(非标准下)： 只包含元素类型的节点，ie7以下不会包含非法嵌套子节点
childNodes只包含一级子节点，不包含后辈孙级以下的节点
<ul><li>1</li><li>2</li></ul>
<script>
var ul = document.getElementsByTagName('ul')[0];
alert(ul.childNodes.length);//2
</script>
<ul>
<li>1</li>
<li>2</li>
</ul>
<script>
var ul = document.getElementsByTagName('ul')[0];
alert(ul.childNodes.length);//5 还包含了三个文本节点
alert(ul.childNodes[0].nodeName);//#text
</script>
上面的代码ie8以下, ul.childNodes.length 为2
包含非法嵌套的子节点
<ul>
<li>1</li>
<li>2</li>
<p>3</p>
</ul>
<script>
var ul = document.getElementsByTagName('ul')[0];
//chrome
alert(ul.childNodes.length);//7
//ie8
alert(ul.childNodes.length);//3
//ie7
alert(ul.childNodes.length);//2
</script>
children 属性
跟childNodes的区别是，它只包含元素节点
推荐使用， 兼容性更好
firstChild firstElementChild
firstChild属性返回当前节点的第一个子节点，如果当前节点没有子节点，则返回null
firstElementChild属性返回当前节点的第一个Element子节点，如果不存在任何Element子节点，则返回null。
firstChild兼容性问题：
- 标准下：firstChild会包含文本类型的节点
- 非标准下：只包含元素节点
firstElemenetChild兼容性问题:
再ie8以下不支持
所以我们最好是用div.children[0]来代替firstElementChild
