第5章DOM编程使用getElement系列方法实现DOM元素的查找和定位本章任务任务1画出页面的文档节点结构图任务描述任务分析什么是DOM？文档对象模型（DocumentObjectModel）通过DOM可以动态改变文档内容动态改变文档内容的原理解析文档（如HTML）并生成DOM树通过DOM标准接口+编程语言改变文档内容解析文档生成DOM树的过程DOM树中的节点类型和节点关系W3C规定的三类DOM标准接口CoreDOM（核心DOM），适用于各种结构化文档XMLDOM，专用于XML文档HTMLDOM，专用于HTML文档任务2使用CoreDOM方式动态添加表格任务描述任务分析查看节点访问指定节点的方法创建和增加节点的方法createElement（）：创建节点appendChild（）：末尾追加方式插入节点insertBefore（）：在指定节点前插入新节点cloneNode（）：克隆节点删除和替换节点的方法removeChild（）：删除节点replaceChild()：替换节点任务实现任务实现任务实现练一练任务3使用HTMLDOM方式动态添加表格任务描述任务分析HTMLDOM对象的属性访问思路分析1、使用CoreDOM标准操作获取表格对象2、使用HTMLDOM的table相关对象的属性、方法、事件操作表格类别……代码片段……tableRowObject.insertCell(index)tableRowObject.deleteRow(index)…………代码片段……tableRowObject.insertCell(index)tableRowObject.deleteRow(index)……functionaddRow(){varnewRow=document.getElementById("myTable").insertRow(2);varcol1=newRow.insertCell(0);col1.innerHTML="幸福从天而降";varcol2=newRow.insertCell(1);col2.innerHTML="¥18.5";col2.align="center";}functiondelRow(){document.getElementById("myTable").deleteRow(1);}functionupdateRow(){varuRow=document.getElementById("myTable").rows[0];uRow.className="title";}任务实现任务实现练一练总结