DOM（Document Object Model）的缩写，即文档对象模型 DOM是针对HTML和XML文档的一个API。 DOM描绘了一个层次化的节点树，即HTML文档中的所有内容都是节点(node)。 DOM树中的所有节点均可通过JS进行访问，允许开发人员添加.移除.修改和查询页面的某一部分
整个文档是一个'文档节点'
每一个HTML元素是'元素节点'
HTML元素内的文本是'文本节点'(回车也是文本节点)
每个HTML的属性是'属性节点'
注释是'注释节点'
返回一个整数，这个数值代表节点的类型 1.元素节点 返回1 2.属性节点 返回2 3.文本节点 返回3 4.注释节点 返回8 5.文档节点 返回9
返回节点的名称 1.元素节点 返回 标签名称(大写) 2.属性节点 返回 属性名称 3.文本节点 返回 永远都是 #text 4.注释节点 返回 永远都是 #comment 5.文档节点 返回 永远都是 #document
返回元素的标签名 在HTML中，tagName属性的返回值始终是大写的
返回节点的值 1.元素节点 返回 undefined或者null 2.文本节点 返回 文本内容 3.属性节点 返回 属性值 4.注释节点 返回 注释内容 5.文档节点 返回 null 注：对于元素节点，用innerHTML/innerText/value设置或取值
节点之间的关系，通常用家庭中的辈分关系来描述
parentNode:父节点children:所有元素子节点childNodes:所有子节点，ie678与高版本浏览器返回值不一样nextSibling:下一个兄弟节点previousSibling: 上一个兄弟节点firstChild:第一个子节点 -lastChild:最后一个子节点 属性1 属性2 描述 nextSibling nextElementSibling 不兼容IE678 下一个兄弟节点 previousSibling previousElementSibling 不兼容IE678 上一个兄弟节点 firstChild firstElementChild 不兼容IE678 第一个子节点 lastChild lastElementChild 不兼容IE678 最后一个子节点DocumentFragment
documentFragment是一个文档碎片，是一种‘轻量级节点’，是一个虚拟的节点对象 documentFragment的nodeType值为11，nodeName的值为f#document-fragment 通常作为仓库来使用，不存在DOM树上，将多个需要插入的新节点放在文档碎片上，再插入文档中可以优化DOM操作
var Fragment=document.createDocumentFragment(); //创建一个文档碎片行间样式和非行间样式
8.1行间样式：
<div class="box2" style="width: 200px;height: 100px;background:blue;"></div> console.log( box1.style.width );8.2非行间样式：
css: .box1{ width: 100px; height: 100px; background: red; } html: <div class="box1"></div> console.log( box2.style.width );8.3getComputedStyle获取样式(不兼容IE678) getComputedStyle(对象,参数).样式 第一个参数是元素对象 第二个参数可以是任何数据,通常写为null或false
eg: getComputedStyle(box1,null).width;**注：**currentStyle：IE678获取样式的方法 如：obj.currentStyle.样式 兼容性处理：
function getStyle(dom,attr){ if (dom.currentStyle) {//IE return dom.currentStyle[attr]; } else { return getComputedStyle(dom,null)[attr]; } }获取滚动条高度一般使用如下方式: var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
