DOM是一套Web标准，它定义了访问HTML文档对象的一套属性、方法和事件，DOM实际上是建立网页与JavaScript语言沟通的桥梁。
1、 对象模型结构
DOM的英文全称是Document Object Model，即文档对象模型。文档一般是指HTML文档，DOM对象模型将HTML文档组织为以Node对象为节点的层次结构。一个节点是一个Node对象。Node对象按照节点类型分为元素节点、属性节点、文本节点和注释节点。
元素节点（也称为元素对象）由元素节点、属性节点、文本节点和注释节点构成。
元素对象结构如下图所示：
在DOM对象模型中，Document是文档对象，通过Document对象可以获取所有HTML文档中的元素对象。
Document对象结构如下图所示：
浏览器在解析HTML文档时，若遇到<body>标签和<frame>，会自动创建Window对象，Windos对象是DOM对象模型中最顶层的对象，通过Windos对象可以获取Document对象。
2、DOM对象层次结构
DOM最顶层是Window对象，Window对象下面是Document（文档对象）、Navigator(浏览器对象)、Screen（屏幕对象）、History（浏览历史对象）、Location（URL对象）。
DOM对象层次结构如下图所示：
3、DOM对象的使用
应用DOM可以完整解析HTML网页，DOM会在内存中构建一棵完整的解析树，来实现对网页文档的动态访问和操作，它把网页所有的HTML元素都解析为树上层次分明的节点，然后可以对这些节点进行添加、修改、删除和查看等操作。
在DOM树中，Window对象是树的根节点，Document对象是Window的子节点，也可以说Window对象是Document对象的父节点。Winodw对象表示浏览器打开的窗口，它是一个全局对象，浏览器窗口内所有的计算和操作都在窗口环境中，因此Window对象的属性也可以直接作为全局变量来使用。
例如：documet对象是Window对象的属性，在JS函数中可以直接使用documet对象，而不必写winodw.document。
同样也可以把Window对象的方法作为全局函数来使用。例如：alert()方法是Window对象的方法，在JS函数内可以直接写alert()，而不必写window.alert()。
案例：遍历HTML网页的所有元素节点
<html>
<head>
<title>JavaScript开发案例</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
// 递归遍历节点
function travel_node(node) {
// 遍历node所有子节点
for(var i = 0; i < node.childNodes.length; i++){
// 若节点是元素节点且子节点大于0
if(node.childNodes[i].nodeType == 1 && node.childNodes[i].childNodes.length > 0) {
// 拼接节点名称
tagName = "<" + node.childNodes[i].nodeName + ">"
document.getElementById("text_info").innerText += tagName;
// 递归遍历子节点
travel_node(node.childNodes[i])
}
}
}
function travel() {
// document对象的documentElement属性HTML元素的根节点
travel_node(document.documentElement)
}
</script>
</head>
<body>
<p>朝辞白帝彩云间，</p>
<p>千里江陵一日还。</p>
<p>两岸猿声啼不住，</p>
<p>轻舟已过万重山。</p>
<p><span style=" margin-left:30px;" id="text_info"></span></p>
<input type="button" value="遍历DOM元素" onclick="travel()"/>
</body>
</html>