前言：
通过javascript可以重构整个HTML文档，可以添加、移除、改变、或重排页面上的项目。要改变页面上的某个部分，javascript就需要对HTML文档中所有元素设置进行访问的接口。通过这个接口，可以提供对HTML元素进行添加、移动、改变、或移除的方法和属性，这些都是由文档对象模型（DOM）来实现。简单点说，HTML文档代表的是页面，而DOM则代表了如何去操作页面。
1、DOM树的结构
DOM节点树中的节点有元素节点、文本节点、和属性节点等三种不同的类型。
2、document对象
document对象代表一个浏览器窗口或框架中显示的HTML文件。浏览器在加载HTML文档时，为每个HTML文档创建document对象，document对象是window对象的一个属性。document对象有大量的属性和方法。
最常用的函数如下：
document.write():动态的向页面写入内容。
document.createElement(Tag):创建一个html标签对象。
document.getElementById(ID):获得指定ID值的对象。
document.getElementByName(Name):获取指定name值的对象。
Example a :
var mainContent = document.getElementById("main"); //alert(mainContent); mainContent.style.backgroundColor = "#FF0000"; var paragraphs = document.getElementsByTagName("p"); for (var i = 0; i < paragraphs.length;i++) { paragraphs[i].style.fontSize = "2em"; } var elements = document.getElementsByTagName("body")[0].childNodes; for (var i = 0; i < elements.length;i++) { alert(elements[i].nodeType); } HTML文档：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="UI._default" %>DOM Welcom to my web sit
We sell all the widgets you need
注：childNodes属性返回节点的子节点集合，以Nodelist对象（换行为文本节点）。
Document对象还有下面几个比较常用的方法和属性：
open():打开一个流，以收集来自任何document.write()或document.writeln()的方法的输出。
close():关闭document.open打开的输出流，并显示选定的数据。
write():向文档写HTML代码或javascript代码。
writeln():等同于write()方法，不同的是在每个表达式之后写一个换行符。
title:该属性可以引用和设置页面中title标记的内容。
Example b:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="UI._default" %>DOM 输入你的姓名：
3、获取DOM中的元素
DOM中定义了多个获取元素节点的方法，如getElementById()、getElementsByName()和getElementsbyTagName()。如果需要获取文档中某一特定的元素节点，最有效的方法是getElementById()。
3.1、getElementById()：该方法是通过元素节点的ID来准确的获取元素节点。
Example:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="UI._default" %>DOM 这是标题
点击标题，会提示出它的值
3.2 getElementsByName():根据Name属性来获取元素节点，得到的是一个元素节点数组。
example:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="UI._default" %>DOM
注：getElementById()能够与GetElementsByName()结合起来用：document.getElementById("a").GetElementsByName("b")意思就是获取Id为a元素节点的子节点中Name属性为b的所有元素节点，以数组的形式表示。
3.3 getElementsByTagName():通过元素的标签名获取节点，同样该方法返回的也是一个数组。