7月16日：DOM总结

一、获取节点的方式

1. getElementById、getElementByTagName、getElementByName、getElementByClassName;前2种兼容性更好，后2种需要调试

　　　　if(children[i].nodeType == 3 && /^\s+$/.test(children[i].nodeValue)) {
　　　　} else {
　　　　　　arr.push(children[i]);
　　　　}

　　2.通过节点关系属性获取节点

　　　　对象.parentNode  获得父节点的引用；
　　　　对象.childNodes  获得子节点的集合；
　　　　对象.firstChild  获得第一个子节点；
　　　　对象.lastChild  获得最后一个子节点；
　　　　对象.nextSibling  获得下一个兄弟节点的引用；
　　　　对象.previousSibling  获得上一个兄弟节点的引用；

二、创建节点

1. 创建元素节点
   document.createElement("元素标签名");

2. 创建属性节点
   document.createAttribute("属性名");
   对象.属性="属性值"
   对象.setAttribute(属性名,属性值)

3. 创建文本节点
   对象.innerHTML="";
   document.createTextNode("文本");

4. 添加节点到最后

　　　　父对象.appendChild(追加的对象)  插入到最后

　　5.在具体的元素之前添加节点

　　　　父对象.insertBefore(要插入的对象,之前的对象)

三、复制

　　var obj = document.getElementById("out").cloneNode(boolean);

　　当boolean值为true时为深度克隆，连同子元素一起复制；当boolean值为false时为普通克隆，只复制本元素。

四、替换节点

　　父对象.replaceChild(要修改的对象,被修改的);

　　d1.replaceChild(p,document.getElementById("p1"))

五、移除节点

　　父对象.removeChild(删除的对象)；

　　清空内存  对象=null;　　

　　　　document.body.removeChild(div);
　　　　div = null;

转载于:https://www.cnblogs.com/f19huangtao/p/4652966.html