大纲：
1.DOM概述
2.获取元素的五种类型
3.查询和遍历
4.属性
5.内容
6.判断 创建 添加 移除 替换 复制
DOM即文档对象模型，它提供了一套针对XML和HTML进行增删改查的API。DOM把文档映射成文档树。
节点分类：
文本节点——标签节点——属性节点
nodetype nodevalue nodeName;
获取
getElementById(); 只能通过document调用 非标准浏览器下会返回name；定义在document对象上;
document.getElementsByName(); 在IE浏览器中只对表单元素的name起作用定义在HTMLdocument类中，只针对HTML文档有效;
context.getElementsByTagName(); 获取指定上下文中子子孙孙辈分的元素
context.getElementsByClassName(/可以设置多个参数/); 指定上下文，子子孙孙 非标准浏览器不兼容
cnotext.querySelect;
context.querySelectAll();
通过他们两个获取的节点不存在映射关系；
作为节点树的文档
---父子关系；
parentNode;
childNodes;
firstChild;
lastChild;
--兄弟关系
nextSibling
previousSibling
作为元素树的文档
childeren;
firstElementChild;
lastElementChild;
nextElementSibling;
previousElementSibling;
遍历：获取第n层的父元素；
function parent(e,n){
if(n===undefined) n=1;
while(n-- && e) e = e.parentNode;
if(!e || e.nodeType!==1) return null;
return e;
}
属性：
判断属性：hasAttribute();
获取属性：getAttribute();
设置属性：setAttribute();
移除属性：removeAttribute();
内容：textContent innerHTML;
创建 添加 移除 替换节点
0.判断
parentNode.hasChildNodes();
1.创建
createElement;
createTextNode;
createAttribute;
createDocumentFragment;
var frg = document.createDocumentFragment();
for(var i=0;i<arr.length;i++){
var oLi = document.createElement("li");
oLi.innerHTML = "<span>"+(i+4)+"</span>"+arr[i].title;
frg.appendChild(oLi);
}
uLi.appendChild(frg);
2.添加
parentElement.insertBefore(newElement, referenceElement);
1.假如reference为null,则只是追加到父级元素的末尾，相当于appendChild();
2.假如newElement在元素中已经存在，则先删除元素再添加
parentElement.appendChild(newElement); 参数为要添加的元素,context为要添加元素的父级;
3.移除
parentNode.removeChild(node);
4.替换
parentNode.replace(newEle,oldEle);
5.复制
node.cloneNode(deep);默认为true,即深克隆
