通过实例认识动态HTML.docVIP

通过实例认识动态 HTML 一、教学目标 了解动态 HTML，能够实现简单的动态 HTML 效果。 二、教材内容分析 关于 动态 HTML，书上的概念是：“所谓动态 HTML，是指即使在脱离网络环境的情况下，网页下载到浏览器以后仍能够随时变换的 HTML 。”本概念比较模糊，学生从字面上理解比较含混，不透彻，不直观。教师需要将该概念直观化、形象化，便于学生理解。在理解动态 HTML 的同时，需要强调的一点是，并不是网页上所有“动”的效果都是动态 HTML 效果，比如，有的 GIF 图片也会表现出各种活动效果，但这只是图片本身的“动画”效果而不是“动态 HTML ”效果。 三、教学方法及策略 1．通过简单的实例演示，让学生对动态 HTML 概念有比较具体的认识。 2．利用任务驱动法，让学生学会简单的动态 HTML 制作。 3．分组上网搜索动态 DHTML 的应用实例，发挥团队作用，促进学生的团队意识，增强彼此之间??合作。利用精彩的实例，激发学生学习动态 HTML 网页的制作兴趣，提高学生的审美情趣。 四、教学过程 1．教师展示网上搜集到的一个“旋转导航菜单” 师：请学生们就本导航菜单展开讨论。 （1）分析与常见的导航栏的区别。 （2）你看到这个导航菜单在动，你觉得它是普通意义上的动画吗？ 生：根据教师投影出的“旋转导航菜单” 讨论老师提出的问题。 师：希望大家踊跃发言，说出自己的观点。 2．教师给出 DHTML 的比较容易理解的解释 DHTML 不是有关面向服务器的脚本、 JavaApplet 或动画 GIF 图像，所有的这些操作都可以自己完成，除了改变页面内容外，不需要访问服务器。页面下载后，不论什么时候， DHTML 都能处理页面元素，改变页面版面、内容和位置并把结果不断地提供给用户。 3．自己动手制作简单的动态 HTML 师：请同学们从网上找两幅自己喜欢的图片并下载到本地机。然后打开 FrontPage, 先将其中的一幅图片插入，使用 DHTML 效果，利用其中的“鼠标悬停”事件，将第一幅图片交换成第二幅图片。 生：利用网络，在本地机上完成该任务，同时体会动态 HTML 效果。 4．自己动手更多地体验 FrontPage 中的 DHTML 效果 师：请同学们在做完上个题目以后，相互讨论，逐一快速体会其他的 DHTML 效果。 生：相互讨论，完成其他操作。 5．分组上网搜索动态 HTML 的应用实例，更好地理解、体会动态 HTML 的概念及应用 师：按照我们原来的分组，请同学们上网搜索动态 HTML 的应用实例。我们本节只注重直观认识，暂不考虑该动态 HTML 效果是如何实现的。 生：同学们进行分组活动，并做好记录。 6．教师总结 师：同学们，我们本节课主要是了解了动态 HTML 的实现效果，希望同学们通过课堂上讲解的实例，对动态 HTML 有个大致的了解。为以后进一步学习打下基础。请同学们利用剩余及课后的时间，完成表 5-1 的填写。 表 5-1 动态 HTML 效果举例 网页地址 是否运用动态 HTML 运用了哪几种你知道的动态 HTML 效果 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 五、对该案例的评价 利用任务驱动法，使学生进行有目的的学习和总结；利用分组完成任务，有助于增进学生的团队意识，提高合作精神。 六、还可以怎样讲 以“动态 HTML ”为搜索目标，让同学们自己进行学???、总结，提高学生们的自学能力。 七、可能遇到的问题 学生花费了一些时间，却没能找到相关的一些动态 HTML 效果。怎么办？ 因为学生第一次接触 DHTML，把握不透，所以在网上搜索动态 HTML 效果时，却没能找到几个。鉴于此，教师应该提前把工作做细，可以提供一些自己搜索到的动态 HTML 效果，把网址告诉同学们。这样就能节省时间，加快学生对动态 HTML 效果的认知。