一、背景介绍
什么是DOM？
DOM 是 Document Object Model（文档对象模型）的缩写。
DOM是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。
在 HTML DOM中，所有事物都是节点。DOM 是被视为节点树的 HTML。
二、知识剖析
什么是DOM节点
HTML 文档中的所有内容都是节点。
1、整个文档是一个文档节点 ；
2、每个 HTML 元素是元素节点 ；
3、HTML 元素内的文本是文本节点；
4、每个 HTML 属性是属性节点；
5、注释是注释节点。
三、常见问题
属性是节点（HTML 元素）的值，您能够获取或设置。那么有哪些常见的DOM属性？
四、解决方案
设置或返回表格行的开始和结束标签之间的 HTML。
nodeName 属性
规定节点的名称。
1、元素节点的 nodeName 与标签名相同 ；
2、属性节点的 nodeName 与属性名相同 ；
3、文本节点的 nodeName 始终是 #text ；
4、文档节点的 nodeName 始终是 #document。
规定节点的值。
1、元素节点的 nodeValue 是 undefined 或 null ；
2、文本节点的 nodeValue 是文本本身 ；
3、属性节点的 nodeValue 是属性值。
五、编码实战
六、扩展思考
对元素的操作方法有哪些？
访问元素的方法
1、通过使用getElementById()方法 ；
2、通过使用getElementByName() 方法；
3、通过使用getElementsByTagName() 方法；
4、通过使用getElementsByClassName() 方法。
修改元素的方法
1、改变Html的内容，如：document.getElementById("p1").innerHTML="New text!";
2、改变CSS的样式，如：document.getElementById("p2").style.color="blue";
DOM事件
允许 JavaScript 对 HTML 事件作出反应
1、onclick 事件——当用户点击时
2、onload 事件——用户进入
3、onunload 事件——用户离开，如刷新页面，提交表单，关闭窗口，关闭浏览器时触发（这个事件在Chrome和Opera浏览器里并不支持）
4、onmouseover事件——鼠标移入
5、onmouseout事件——鼠标移出
6、onmousedown事件——鼠标按下
7、onmouseup 事件——鼠标抬起
七、更多讨论
讨论点一：DOM有什么缺点？
讨论点二：如何获取属性节点的节点值？
讨论点三：DOM中的property和attribute的区别是什么？
八、参考文献
参考一：W3C
