《Web前端开发实战教程》电子教案 第5章 DOM 编程-教案.docxVIP

教学章节

第5章DOM编程

预计学时

8

教学目的

通过商品分类管理模块实例，使学生能够了解文档对象模型的基本概念和作用，理解DOM与HTML文档之间的关系，深入掌握DOM的树状结构及其组成元素，学习使用DOM方法进行页面元素的选择、遍历和修改，掌握通过DOM处理各类用户事件和浏览器事件的方法，并能熟练运用DOM操作表单元素及处理表单数据。

教学重点

DOM树状结构的理解、DOM方法操作页面元素、表单数据的DOM处理。

教学难点

DOM事件处理。

教学方法

问题导入——启发思考——讲练结合——构建知识

教学手段

动态多媒体课件和板书结合、上级实践操作

教学内容

DOM简介

DOM与HTML文档的关系解析

DOM树状结构的组成与节点类型

DOM控制元素

DOM事件处理

DOM表单处理

综合实践：商品分类管理模块实现

教学过程

课堂导入

引入商品分类管理实例，进行需求分析，设计实现思路，分析在实现实例过程中需要哪些知识点。

授课内容

讲解DOM简介和DOM与HTML的关系。

讲解DOM的结构。

3、通过实例讲解使用DOM控制元素（重点）

（1）选择DOM元素

（2）遍历DOM元素

（3）修改DOM元素

3、通过实例讲解DOM的事件处理。（难点）

4、通过实例讲解DOM的表单处理。（难点）

案例实现（难点）

1、讲解实验所用的相关技术及知识点。

2、介绍案