DOM的全称是文档对象模型（即Document Object Model），它在本质上是一种文档平台。文档对象模型（DOM）是表示文档（如HTML和XML）和访问、操作构成文档的各种元素的应用程序接口（API）。支持Javascript的 所有浏览器都支持DOM，DOM实际上是一个能够让程序和脚本动态访问和更新文档内容、结构和样式的一种语言平台。
DOM ：文档对象模型
- 通过DOM可以动态地改变文档内容
- 动态改变文档内容的原理： 解析文档（如HTML）并生成DOM树
- 通过DOM标准接口+编程语言改变文档内容
W3C规定的三类DOM标准接口：
- Core DOM(核心DOM)，适用于各种结构化文档
- XML DOM（JAVA OOP学过），专用于XML文档
- HTML DOM,专用于HTML文档
DOM简介
DOM将整个HTML页面文档规划成由多个相互连接的 节点级构成的文档，文档中的每个部分都可以看作是一个节点的集合。这个节点集合可以看作是一个节点树（Tree），通过这个文档树，开发者可以通过DOM文档对文档的内容和 结构十分 方便地进行节点的遍历、添加 、删除、修改和替换。
DOM是一种与浏览器、平台、语言无关的接口，通过DOM可以很好的解决NetSpace的Javascript和Microsoft的JScript之间的冲突，给予WEB设计师和开发者一个标准的方法，可以方便地访问站点中的数据、脚本和表现层对象。DOM API也是由客户端的脚本调用，因此不需要服务器的直接支持。
基本的DOM方法
查看节点
访问指定节点的方法
getElementById() ---ID名称 返回值只能有一个
getElementsByName()
getElementsByTagName() ---标签名称
getElementsByClassName查看/修改属性节点
getAttribute("属性名")
setAttribute("属性名","属性值")接引用节点
获取样式
获取行内样式的方法
document.getElementById(elementId).style
获取类样式的方法
currentStyle (IE)
getComputedStyle() (W3C) 接引用节点
1.引用节点
（1）document.getElementById(id)方法：在文档里通过id来找节点，返回是找到的节点对象，只有一个。
（2）document.getElementsByTagName(tagName)方法：通过HTML的标记名称在文档里面查找，返回的是满足条件的数组对象。
2.直接引用节点
（1）element.parentNode属性：引用父节点
（2）element.childNodes属性：返回所有的子节点的数组
（3）element.nextString属性和element.nextPreviousSibling属性分别是对下一个兄弟节点和上个兄弟节点的引用。
3.获得节点信息
（1）nodeName属性：获得节点名称
（2）nodeType属性：获得节点 类型
（3）nodeValue属性：获得节点的值
（4）haschildNodes()：判断是否有子节点
（5）tagName():获得标记名称
4.处理节点信息
除了通过“元素节点”.属性名称的方式四访问外，还可以通过setAttribute()和getAttribute()方法设置和获取节点属性。
（1）elementNode.setAttribute(attributeName,attributeValue):设置元素节点的属性。
（2）elementNode.getAttribute(attributeName):获取属性值。
5.处理文本节点
主要有innerHTML和innerText两个属性。
（1）innerHTML属性：设置或返回节点开始和结束标签之间的HTML；
（2）innerText属性：设置或返回节点开始和结束标签之间的文本，不包括HTML标签。
6.文档层级结构相关
（1）document.createElement()方法：创建元素节点。
（2）document.createTextNode()方法：创建文本节点。
（3）appendChild(childElement)方法：添加子节点。
（4）insertBefore(newNode,refNode)：插入子节点，在refNode节点前插入newNode节点。
（5）replaceChild(newNode,oldNode)方法：取代子节点，oldNode必须是parentNode的子节点。
（6）cloneNode(includeChildren)方法：复制节点，includeChildren为bool，表示是否复制其子节点。
（7）removeChild(childNode)方法：删除子节点。
DOM模型中的节点
1.元素节点
可以说整个DOM模型都是由元素节点构成的。元素节点可以包含其他的元素，例如li可以包含在ul中，唯一没有被包含的就只有根元素HTML。
2.文本节点
在HTML中，文本节点是向用户展示的内容，如
<a href="www.baidu.com" title="主页">我的主页</a>“我的主页”就是一个文本节点。
3.属性节点
页面中的元素，或多或少都会有一些属性，例如，几乎所有的元素都有title属性。可以利用这些属性，对包含在元素里的对象做出更准确的描述。例如，
<a href="www.baidu.com" title="主页">主页</a>上面代码中，href=”www.baidu.com” 和title=”主页”就分别是两个属性节点。
使用非标准DOMinnerHTML属性
HTML文档中每一个元素节点都有innerHTML属性，我们通过对这个属性的访问可以获取或者设置这个元素节点标签内的HTML内容。
DOM与CSS
通过Javascript和HTML DOM可以方便地改变HTML元素的CSS。
语法如下：
document.getElementById(id).style.property=new style1.三位一体的页面
网页的内容可以分为结构层、表现层和行为层三部分。
网页的结构层由HTML或XHTML之类的标记语言负责创建，元素（标签）对页面各个部分的含义做出描述，例如ul元素表示这是一个项目列表。
页面的表现层由CSS来创建，即如何显示这些内容，如采用蓝色、Arial字体、粗体显示。
行为层负责内容应该如何对事件做出反应，也就是Javascript和DOM所完成的。
页面的表现层和行为层总是存在的，即使没有明确地给出具体的定义和指令他们依然存在。因为Web浏览器会把它的默认样式和默认事件加载到网页的结构层上。如浏览器会在呈现文本的地方留出页边距，会在用户把鼠标指针移动到某个元素上方时弹出title属性提示框等。
这三层技术也是存在重叠的，如用DOM来改变页面的结构层、createElement()等。CSS也有hover这样的伪属性来控制鼠标指针滑过某个元素的样式。
2.使用className属性
——修改节点的CSS类别。
技巧：
通过className添加CSS
oMy.className+=”….”; //追加CSS类
前提是保证追加的CSS类别中的各个属性与原来的属性不重复。
技巧：如何检查浏览器支持的DOM标准级别
DOM标准有两个版本（“级别”），不同浏览器对DOM标准的支持程度有所不同，IE5以上版本支持使用HTML文档的基本1级DOM接口，Netscape支持2级DOM接口，如下代码可以检测浏览器支持的DOM接口级别。
if(document.implementation&&
Document.implementation.hasFeature&&
Document..implementation.hasFeature("heml","1.0"))
{
//如果支持HTMLDOM1级执行
}