DOM_节点层次

一、DOM1级定义了一个Node接口，这个接口是由DOM中的所有节点类型实现的。Node接口共有12种节点类型，常见的是元素节点、文本节点和文档节点。

Node.ELEMENT_NODE(1);——元素节点

Node.Text_NODE(3);——文本节点

Node.DOCUMENT_NODE(9);——文档节点

二、IE浏览器没有Node类型的构造函数，保证兼容，可以做以下比较：检查节点类型 是否是元素

if (someNode.nodeType == 1) { //兼容所有浏览器
    alert('Node is an element');
    value = someNode.nodeName;
}}

对于 元素节点  nodeName始终是标签名 nodeValue始终是null

三、每个节点都有childNodes属性，保存着一个NodeList对象。NodeList是类数组对象，但并不是Array的实例，是对象，并且是实时更新。

someNode.childNodes[0] || someNode.childNodes.item(0)

NodeList转换为数组：

function coverToArray(nodes) {
    var array = null;
    try {
        array = Array.protoType.slice.call(nodes,0);//其他浏览器
    } catch（ex）{
        array = new Array();
        for (var i = 0, len = nodes.length; i < len; i++) {
            array.push(nodes[i]);//IE8以及更早版本
        }
    }
    return array;
}

注：hasChildNodes() 返回布尔值 查询是否存在子节点 效率高于查询childNodes列表

所有节点都有ownerDocument 指向整个文档的文档节点（document）.

四、节点操作

appendChild(新节点) 在末尾添加一个节点，

insertBefre(新节点，参照节点) 插入到特定位置

replaceChild(新节点，老节点) 替换节点 老节点还在文档 但是没有位置

removeChild(节点) 删除节点 节点还在文档 但是没有位置

cloneNode(布尔值) true：深复制

<ul>
    <li>11</li>
    <li>22</li>
    <li>33</li>
</ul>
myList = document.getElementById("list");
var deepList = myList.cloneNode(true);
alert(deepList.childNodes.length)//3(IE <9) 或者 7 (其他浏览器)

IE8— 不为空白符创建节点 因此为3

cloneNode()不会复制事件 但是IE会复制事件 所以复制之前需要先移除事件。