标签：
【前面的话】DOM全称是Document Object Model，即文档对象模型。我们常说的html文档其实就是一个DOM树，DOM操作就是在内存中找到DOM树上我们想要的DOM对象，对它的属性进行修改，然后渲染引擎会把修改的结果重新绘制在界面上。DOM里面涵盖的知识点还是很多的，尤其是到后来要兼容浏览器的时候是很绕的，这次先讲一些DOM的相关概念，等聊完BOM之后，我会再针对兼容浏览器这块做个小总结。
① nodeType
//节点 //nodeType 1-元素节点 ， 2-属性节点 ， 3-文本节点
② nodeName
// nodeName 如果是标签则返回的是标签的名称；如果是文本则返回的是#text；如果是属性节点则返回属性的名称
③ nodeValue
// nodeValue 如果是标签则始终返回null ； 如果是文本节点则返回文本的内容 ； 如果是属性节点则返回属性的值
④节点的复制
element.cloneNode(); // 克隆一个新的DOM对象；参数为Boolean类型，true赋值子节点，false不复制子节点 element.appendChild(); // 追加元素
1 element.className = " "; //仅删除class类的值，保留类名 2 element.removeAttribute("class") //完全删除这个类
1 // 获取属性节点 2 var attrNode = box.getAttributeNode（"id"）； 3 console.log(attrNode.nodeType); //属性节点的nodeType 2 4 console.log(attrNode.nodeName); //属性节点的nodeName 属性的名称 5 console.log(attrNode.nodeValue); //属性节点的nodeValue 属性的值 6 7 // 设置属性 setAttribute 8 9 // 移除属性 removeAttribute
1 childNodes 所有的子节点——DOM标准的方法，除了获取子标签以外，还会获取文本节点；IE8以前会忽略空白节点 2 children 所有的子元素——非标准的DOM方法，但是几乎所有的浏览器都支持，只会获取元素节点
1 element.nextSibling 下一个兄弟节点，可能是非元素节点，会获取到文本节点 2 element.nextElementSibling 获取下一个紧邻的兄弟元素，会忽略空白 // IE8以前不支持此属性 3 4 element.previousSibling 上一个兄弟节点，可能是非元素节点，会获取到文本节点 5 element.previousSibling 获取上一个紧邻的兄弟元素，会忽略空白 // IE8以前不支持此属性
1 previousElementSibling 上一个兄弟节点 2 nextElementSibling 下一个兄弟节点
标签：
原文地址：http://www.cnblogs.com/DF-fzh/p/5348735.html
