HTML DOM详细知识
1：节点
HTML DOM中，所有的事物都是节点。
整个文档是一个文档节点；
每个HTML元素是一个元素节点；
每个元素内的文本是一个文本节点；
每个属性是一个属性节点；
每个注释是一个注释节点；
2：方法
首先理解“编程接口”的概念：我们可以通过编程语言（如javaScript）对HTML DOM进行访问，这里把HTML元素视为对象，编程接口就是对象的方法和属性。通过方法和属性来对对象进行操作。
HTML DOM方法是可以在节点上执行的动作。
常用的HTML DOM方法：
getElementById(id)：获取带有指定id的节点（元素）；
getElementsByTagName(tagName)：获取包含指定标签名称的所有元素的节点列表（集合、数组）；
getElementsByClassName(className)：获取包含指定类名的所有元素的节点列表（集合、数组）；
appendChild(node)：插入新的子节点；
removeChild(node)：删除子节点；
3：属性
HTML DOM属性是节点上能够获取或设置的值。
innerHTML属性：获取元素内容，对于获取或替换HTML元素的内容很有用。
nodeName属性：规定节点的名称。它是只读的。元素节点的nodeName与标签名相同，属性节点的nodeName与属性名相同，文本节点的nodeName为#text，文档节点的nodeName为#document。
nodeValue属性：规定节点的值。元素节点的nodeValue为undefined或者null，文本节点的nodeValue为文本内容，属性节点的nodeValue为属性值。
nodeType属性：返回节点的类型，是只读的。元素节点的nodeType为1，属性节点的nodeType为2，文本节点的nodeType为3，注释节点的nodeType为8，文档节点的nodeType为9。
4：访问
访问节点也就是查找HTML的元素。
对HTML DOM节点的访问主要通过上文所说的方法来进行。
5：修改
修改HTML DOM意味着很多方面的内容，如：
该表HTML内容、改变CSS样式、改变HTML属性、创建新的HTML元素等等。
创建HTML内容：最简单的方式是使用innerHTML属性。如：
document.getEmlemntById("p1").innerHTML="新文本";改变HMTL样式：如：
document.getElementById("p1").style.color="red";
document.getElementById("p1").style.fontSize="larger";
创建新的HTML元素：需要先创建新节点，然后把它追加到已有的元素节点上。如：
var para = document.creatElement("p");
var node = document.creatTextNode("这是一个新段落");
para.appendChild(node);
document.getElementById("div1").appendChild(para);
6：事件
HTML DOM允许JavaScript对HTML事件做出反应。当事件发生时，可以执行JavaScript。比如用户点击某个元素时执行代码。
事件属性：使用事件属性来向元素分配事件。如：
<button onclick="displayDate()">点我</button> //向botton属性分配了onclick事件。使用HTML DOM来分配事件：如：
document.getElementById("p1").onclick=function(){displayDate()};onload和onunload事件：当用户进入和离开页面时，会触发onload和onunload事件。它们可用于检查浏览器类型、处理cookies。
onchange时间：常用于输入字段的验证。当焦点离开时会触发。如：
<input type="text" id="fname" onchange="upperCase()">onmouseover和onmouseout事件：当鼠标指针移动到或离开元素时会触发。
onmousedowm、onmouseup及onclick事件：他们是一次鼠标点击的全部过程。当鼠标按钮被点击时，出发onmousedown，鼠标按钮松开时，触发nomouseup，最后鼠标点击完成，触发onclick。也就意味着，需要定义一次点击事件时，可以直接使用onclick。当需要点击和松开事件时，需要另外两个。
7：导航
在HTML DOM中通过节点关系来进行导航。
节点列表：节点列表是一个节点数组，通过下标可以访问相应的节点。与数组相似，通过length属性可以返回数组长度（节点个数）。
节点关系：可以使用三个节点属性，分别是：parentNode、firstChild及lastChild。
根属性：document.documentElement：全部文档； document.body：文档的主体。
childNodes和nodeValue：除了使用innerHTML，还可以使用childNodes和nodeValue属性来获取元素内容。如：
txt = document.getElementById("intro").childNodes[0].nodeValue; //获取id为intro的元素的第一个子元素的值
