1.获取节点
//获取节点
document.getElementById(id);
//HTMLCollection(chrome)
document.getElementsByTagName("div");
//NodeList(chrome)
document.getElementsByName(name);
//HTMLCollection(chrome)
document.getElementsByClassName(classname);
2.添加节点
//在childNodes列表末尾添加节点
//如果newNode已存在,则将原节点移动到新的位置
var returnedNode = someNode.appendChild(newNode);
alert(returnedNode === newNode); //true
3.插入节点
//在childNodes列表中某个特定位置中插入节点
//在最后一个位置插入
var returnedNode = someNode.insertBefore(newNode, null);
alert(returnedNode === newNode) //true
//在第一个子节点前面插入节点
var returnedNode = someNode.insertBefore(newNode, someNode.firstChild);
//在最后一个子节点前面插入节点
var returnedNode = someNode.insertBefore(newNode, someNode.lastChild);
4.替换节点
//替换节点
//替换第一个节点
someNode.replaceChild(newNode, someNode.firstChild);
//替换最后一个节点
someNode.replaceChild(newNode, someNode.lastChild);
5.移除节点
//移除节点
//移除第一个节点
someNode.removeChild(someNode.firstChild);
//移除最后一个节点
someNode.removeChild(someNode.lastChild);
6.复制节点
IE浏览器会复制事件处理程序,在复制之前最好先移除事件处理程序。
//复制节点
//深复制(子节点一起复制)
var deepList = someNode.cloneNode(true);
//浅复制(不复制子节点)
var shallowList = someNode.cloneNode(false);