粤教版选修3 网络技术应用5.1 动态HTML公开课课件ppt
展开《网页脚本的使用》教学设计
【教材分析】
本节内容是广东教育出版社，信息技术选修3《网络技术应用》第五章第一节的内容。对于动态网页的学习，本节起了承上启下的作用，主要是为了提高学生学习代码的兴趣。本节课是否引导好，直接影响学生学习第五章的状态，以生动、有趣的例子，由浅入深，引导学生制作动态网页。
【学情分析】
本课的教学对象是高一的学生。在学习本课之前，他们已经系统地学习了Frontpage制作网页的基本方法，简单地学习了HTML语言，并能用Frontpage制作简单的网页。学生对设计网站不再仅仅满足于简单的静态网页，对动态性网页有了更强的学习动力和要求。
【教学目标】
一、知识与技能：
- 了解javascript的特点，掌握javascript的概念。
- 掌握在HTML中加入javascript代码的方法。
- 能够在指定位置加入javascript代码。
- 合理运用网上javascript代码，并学会修改javascript代码中文字属性的方法。
二、过程与方法：
- 在三个不同难度系数的任务驱动上，体会javascript技术的优势，掌握使用javascript代码的方法。
- 在小组合作学习、互相交流中，培养学生的协作学习能力和自主探究的能力。
三、情感态度与价值观：
- 感受javascript在动态网页中发挥的作用，提高学生学习代码的兴趣。
- 提升学生自主探究能力和合作学习能力。
【教学重点和难点】
教学重点：掌握加入javascript代码的方法，能够在指定的位置加入简单的javascript代码。
教学难点：合理使用网上代码，找准代码的添加位置，修改javascript代码的方法，不要更改程序段的结构，只要修改相应属性的属性值。
【教学媒体和资源】
在多媒体网络机房，教师自制网页脚本的网站并发布，把在课堂上需要呈现的脚本效果全在页面上给学生显示，给学生直观的感受，激发学习兴趣。学习网站作为教学资源，可以让学生牢牢把握教师的教学过程，对于难掌握的代码添加方法、属性更改方法学生可以在需要的时候自主学习。同时对学生之间的差异也充分考虑，让不同层次的学生在课堂上都有事可做，都能有收获。
【教学方法】
讲授法、任务驱动、合作学习、自主学习
【课时】1课时
【教学过程】
一、创设情境，引入课题
带领学生欣赏特效网页，让学生观看特殊的效果：如飘落的雪花、滚动的图片和文字、鼠标后跟随的三维彩带，感受动态网页的不同，引出javascript的概念。
二、Javascript的概念和特点
JavaScript语言简介：Script（脚本）是一组指令能被浏览器解释执行,在万维网上常用脚本语言（JavaScript和VBScript）。JavaScript语言是一种介于Java与HTML之间，基于对象事件驱动的编程语言。在网页中应用JavaScript，可使网页变得更生动，具有更强的交互功能。
JavaScript的特点：简单性、动态性、跨平台性
三、Javascript的初识
使用以下的代码将JavaScript嵌入到网页中。教师详细讲解脚本标记，要求学生理解并记住脚本标记对。
<script language="JavaScript">
……
</script>
这个标记可以放到<head></head>标记之间，也可以放到<body></body>标记之间。
教师演示操作如何将“问候访问者”这个脚本添加到HTML中，简单讲解脚本程序段的含义，alert(“”)是弹出含有“”内文字的对话框。
学生观看，掌握添加JavaScript代码的方法。模仿教师操作，在js.htm中完成“问候访问者”脚本的添加，鼓励学生尝试修改对话框里的文字。广播学生的屏幕，引导学生去更改JavaScript脚本程序。
四、Javascript的入门
学生任务一：学生分组完成任务，每个组只要完成下面一个网页脚本。在js.htm网页中添加JavaScript代码。难度系数：★
- 标题栏跑马灯效果(A组完成、B组完成)
- 中文显示系统时间 (C组完成、D组完成)
- 字符大小的设置
- 浏览器状态栏有欢迎语
完成好的同学修改JavaScript代码（主要是修改文字属性，比如：更改文字、更改文字字体、颜色等属性），看看有什么变化。
四个组比一比，赛一赛看哪一组做得又快又好。教师在学生操作的过程中巡视，并适时的点评学生操作过程中出现的问题，再次强化在网页中添加脚本的使用方法和注意点。
提高任务：鼠标跟随文字 难度系数：★★
鼠标后跟随一段飘动的文字，这个效果是不是很酷呢？其实在因特网上有很多类似的代码，我们怎么才能使用网上的JavaScript代码呢？
试试吧，我们如何才能合理使用网上的代码：
修改跟随的文字
修改文字的颜色、大小、字体
看看还有什么你能改的
引导学生修改文字的属性，尝试能不能修改颜色、文字大小和文字字体，总结修改因特网上代码的方法。
完成好的同学可以尝试完成“图像特效”。
知识扩展：代码中的<!--……-->是HTML的注释，//……和/*……*/是JavaScript语言的注释
五、教师总结
总结学生在本节课学到的知识，并指出存在的问题。引导有兴趣的同学课后继续使用网上的JavaScript代码。要求全班同学完成课后练习和评价表，学生自评本节课的学习效果
【教学评价反思】
对于本节课的内容，大部分的同学都完成了，也有一些学有余力的同学完成了图像特效。同学们对本节课的学习兴趣浓厚，并没有畏难的情绪，都积极地完成任务，并根据老师要求，尝试修改代码，找到更改代码的方法。由于时间有限，对于图像特效没有来得及给学生展示，还有一些学生没有实现脚本的效果，也没有及时辅导到，计划将这些作业留到课后去完成。课堂气氛不是特别活跃，师生之间的交流比较频繁，但学生发言机会少。
信息技术5.2 使用表单创建交互访问试讲课课件ppt： 这是一份信息技术5.2 使用表单创建交互访问试讲课课件ppt，文件包含粤教版2019高中选修3信息技术521制作一个在线调查网页课件pptx、粤教版2019高中选修3信息技术521制作一个在线调查网页教案docx等2份课件配套教学资源，其中PPT共9页， 欢迎下载使用。
高中5.1 动态HTML精品ppt课件： 这是一份高中5.1 动态HTML精品ppt课件，共2页。
选修3 网络技术应用4.4 网页的美化与特效制作精品ppt课件： 这是一份选修3 网络技术应用4.4 网页的美化与特效制作精品ppt课件，文件包含粤教版2019高中选修3信息技术44网页的美化与特效制作课件pptx、粤教版2019高中选修3信息技术44网页的美化与特效制作教案docx等2份课件配套教学资源，其中PPT共18页， 欢迎下载使用。
