第五章___动态网页制作.docVIP

5．1 动态HTML 一、教学目标 1、知识与技能 （1）掌握在HTML中加入JavaScript代码的方法。 （2）能够在指定位置加入JavaScript代码。 （3）掌握修改JavaScript代码中文字属性的方法。 综合应用：能够根据网页的内容、风格选择适当的网页特效。 2、过程与方法 （1）培养学生的自主学习、探究学习以及协作学习的能力。 （2）培养学生的创新能力、表达能力。 （3）培养学生进行学习反思的学习习惯。 3、情感态度与价值观 （1）培养学生与他人合作与交流的能力。 （2）培养学生的信息道德素养。 二、学生分析 本课的教学对象是桂城中学的高中二年级学生。在学习本课之前，他们已经学习了用DreamWeaver制作网页的基本方法，能够制作简单的网页，但不熟悉HTML标记语言。因此在学习粘贴JavaScript代码前，应先讲解HTML的基本结构，让学生对HTML有一个基本的认识。 三、重点难点分析 教学重点 掌握加入JavaScript代码的方法。 能够在指定位置加入JavaScript代码。 教学难点 修改JavaScript代码中文字属性的方法。 能够在指定位置加入JavaScript代码。 四、教学方法 教师是教学活动的中的组织者、引导者，学生是学习的主体，也是小组互助学习的参与者。营造高效率的学习环境，培养学生探究、解问题，深入学习技术的兴趣和能力，是课程的根本目标。 五、教学策略 本课是一节典型的技术操作教学课，因此充足的操作练习是必不可少的。如何让学生能够讯速掌握技巧，又不至于因练习难度太大而产生畏难情绪呢？我选择将练习任务细化，安排了两个大的任务，大任务中又包含分层任务。通过难度逐层深入的练习任务，引导学生在“做”中发现知识、掌握知识。从完成指定代码到自行选择代码，由“点”到“面”引导学生完成知识迁移。 （1）范例教学：为了让学生尽快掌握在HTML中加入JavaScript代码的方法，我首选采用范例教学的策略。本课以一个简单的鼠标跟随文字特效制作为引入例子，让学生了解制作JavaScript特效的基本方法，并要求学生完成同样的特效制作。务求从简单任务入手，让学生从成功的体验中感受到JavaScript特效的有趣之处，激发学生继续深入学习的欲望。 （2）任务驱动、探???合作：为了解决本课的教学重、难点，同时培养学生的探究学习、合作学习的能力，本课安排了两个探究任务。任务一的探究任务要求学生以小组为单位，共同探究修改JavaScript代码中文字属性的方法，这是本课的重、难点。我有针对性地指引学生展开合作探究，学生通过对比、讨论很快能找出方法。任务二要求学生自行选择适合难度的代码进行练习。通过明确的任务要求以及不同难度的练习资源，让学生能够进一步巩固本课新学习的操作，完成知识迁移，能够灵活运用不同效果的JavaScript代码。因为可以选择不同难度的练习，也使各个能力层次的学生都能有所提高。 六、教学环境 计算机教室 七、教学过程 教学环节教师活动学生活动对学生学习过程的观察与考查信息技术的应用创设情景、引入课题 1、展示两张网页，要求学生观察对比，找出不同点。 2、分析第二张网页，因为其页面有网页特效，因此令页面生色不少。引出学习内容：动态HTML。 观察两张页面，找出第二张页面究竟有什么特效，明确本课学习目标。 学生普遍能发现第二张页面的不同，但未能完全找出所有的特效，因此我需要指出三种特效，为下面的知识讲解作铺垫 展示两种网页；用幻灯片展示本课课题。知识铺垫、范例演示 1、指出实现动态HTML的方法之一：加入JavaScript代码。 2、解释什么是JavaScript？ 3、HTML的基本结构：展示教学范例网页的源文件，分析其HTML标记语言的组成。 4、演示在网页中加入鼠标跟随文字特效的操作过程，并板书总结操作步聚。结合教学范例，观察HTML的基本结构。 观看教师的操作演示，了解其具体操作步聚。用幻灯片展示知识点；在教学论坛上提供幻灯片的内容供学生参考。任务探究任务探究、合作学习 1、提出问题：如何修改鼠标跟随文字的大小、颜色等相关属性？布置任务一：制作一段鼠标跟随文字效果。 2、指导学生完成练习，开展小组学习，引导学生进行讨论，发现问题、总结方法。 完成任务一，相邻的两位学生为一个学习小组，共同探究修改在JavaScript代码中文字属性的方法。各自完成不同的修改操作，通过讨论找出异同，总结方法。学生基本上能够找到修改跟随文字的方法，但对如何修改文字颜色感到困惑。主要是不知道具体某种颜色应该用哪个数字表示。部分学生能够联系以前所学，找到颜色代码。学生之间有讨论，但善于总结方法。