DOM DOM概述

DOM的官方定义
DOM Document Object Model 文档对象模型。
DOM的官方定义：W3C的DOM，可以使程序或脚本(JS或AS、JScript)，动态的访问或操作文档的内容、结构、样式。
DOM只是一个标准，就是操作网页的标准。而这个标准(模型)在浏览器中，以“对象”的方式实现。

DOM的分类
核心DOM：提供了操作HTML文档(显示)或XML文档(存储数据)的公共的属性和方法。
HTMLDOM：针对HTML文档，提供的专有的属性和方法。
XMLDOM：针对XML文档，提供的专有的属性和方法。
EventDOM：事件DOM，提供了很多的常用事件。
CSSDOM：提供了操作CSS的一个接口。

HTML节点树
DOM中节点的类型：
document文档节点：代表整个网页，document文档节点不对应标记。是访问文档中各元素的起点。
element元素节点：元素节点对应于网页中的各标记。
attribute属性节点：每个元素都有若干个属性。
text文本节点：文本节点是最底层节点。

核心DOM公共属性和方法
nodeName：节点名称。
nodeValue：节点的值。
firstChild：第一个子节点。
lastChild：最后一个子节点。
parentNode：父节点。
childNodes：子节点列表，是一个数组。

节点访问
1.为什么，document.firstChild找到的不是HTML节点呢？
DOM是针对HTML4.01开发的。我们现在是XHTML1.0。
所以，要想使用核心DOM中的属性和方法，必须去掉DTD类型定义。
2.为什么，node_body.firstChild找不到table节点？
在Firefox下，会把空格或换行，当成一个文本节点。因此，所有标记之间的空格和换行，都去掉。

查找html节点的方法
document.firstChild  
document.documentElement(兼容性较好)

查找body节点的方法
document.firstChild.lastChild
document.body(推荐使用)

节点属性
1、getAttribute()——获取属性的值
举例：var src = imgObj.getAttribute("src")
2、setAttribute()——添加属性，设置属性
举例：imgObj.setAttribute("src" ,"images/02.jpg")
3、removeAttribute()——删除属性
举例：imgObj.removeAttribute("src")

节点操作
createElement()创建节点
语法：var nodeObj = document.createElement(tagName)
appendChild()追加节点
语法：parentNode.appendChild(childNode)