第19课网页交互与特效（二）（教案）-《网页设计与制作案例教程（第2版）》同步教学（航空工业出版社）

课题 网页交互与特效（二） 课时 2课时（90 min） 教学目标 知识技能目标： （1） 熟悉JavaScript语言的基础知识 （2） 能够使用Dreamweaver CC为网页引入JS文件，并编写JavaScript代码 思政育人目标： （1） 了解我国古代优秀画作，体会画家的匠心精神，培养钻研精神。 （2） 了解我国古代计算方法，增强民族自豪感。 教学重难点 教学重点：JavaScript语言的基础知识 教学难点：使用Dreamweaver CC为网页引入JS文件，并编写JavaScript代码 教学方法 情景模拟法、问答法、讨论法、练习法 教学用具 电脑、投影仪、多媒体课件、教材 教学设计 第1节课：课前任务→ 考勤（2 min）→ 问题导入（10 min）→传授新知（23 min）→课堂抢答（10 min） 第2节课：任务实施（25 min）→ 实践探索（15 min）→ 课堂小结（3 min）→ 作业布置（2 min） 教学过程 主要教学内容及步骤 设计意图 第一节课 课前任务 · 【教师】布置课前任务，和学生负责人取得联系，让其提醒同学通过文旌课堂APP，查阅资料，了解JavaScript · 【学生】按照教师要求完成课前任务 通过课前的预热，让学生了解所学软件，激发学生的学习欲望 考勤 （2 min） · 【教师】使用文旌课堂APP进行签到 · 【学生】按照老师要求签到 培养学生的组织纪律性，掌握学生的出勤情况 问题导入 （10 min） · 【教师】提出以下问题： 请说说JavaScript有哪些优点？ · 【学生】思考、举手发言 JavaScript简单易学，功能完备且轻便易读，在网页中使用它能够在完善网页功能的同时不给网页增加太多负担。 通过问题导入，引导学生思考，调动学生的主观能动性，了解本节课要学习的内容 传授新知 （23 min） · 【教师】通过学生的发言，引入新的知识点，介绍JavaScript 一、JavaScript简介 【教师】提出以下问题： 什么是JavaScript？ 【学生】分析、思考、举手发言 JavaScript是一种可以嵌入到网页文件中的编程语言，可以实现网页的交互与特效，使用户体验更好。 （详见教材） 二、JavaScript语言基础 1．数据类型 【教师】提出以下学习任务： JavaScript中最基本的数据类型有哪些？ 【学生】查阅资料、思考、理解 JavaScript中最基本的数据类型有数值型、字符串型、布尔型、空值、未定义值。 （1）数值型（number）。JavaScript中的数字都属于数值型数据，数字可以带有小数点，也可以是整数。此外，还可以使用科学计数法表示数值型数据。例如，5e3表示5乘以10的3次方，即5000；5e-3表示5乘以10的-3次方，即0.005。 （2）字符串型（string）。包含在英文的双引号或单引号之中的字符（包括数字、标点符号等），即为字符串。例如，"JavaScript语言基础"与'qwer1234'都是字符串型数据。 （3）布尔型（boolean）。布尔型数据只有true与false两个值，它们对应的数值型数据分别为1与0。布尔型数据常用于JavaScript的控制结构。 （4）空值（null）。空值即null，它是一个特殊的值，用于定义空的或不存在的引用。例如，当引用一个没有定义的变量时，即返回一个空值。 （详见教材） 【课堂互动】教师提出以下问题： 空值是不是字符串或者0？ 【学生】聆听、思考、举手回答 【教师】对学生的回答进行总结 空值不等于空字符串（""）或0。 【课堂互动】教师提出以下问题： 如何区别null与undefined？ 【学生】聆听、思考、举手回答 【教师】对学生的回答进行总结 null与undefined的区别在于，null表示一个变量赋予了空值，而undefined表示变量未赋值。 2．变量 【教师】展示JavaScript中变量的语法，帮助学习理解 在JavaScript程序运行过程中，随时可能产生一些临时数据，这些数据将保存在内存单元中，变量就是指一个已经命名的存储单元。可以说，变量就是一个存储数据的容器。 （1）声明变量。在JavaScript中，使用var关键字声明变量。 当声明多个变量时，变量名之间用英文逗号隔开，如“var a,b,c;”。 声明变量之后，还需要给变量赋值，否则该变量的值默认为undefined。 （2）变量的命名。在JavaScript中，变量的命名规则如下。① 变量名由字母、数字、下划线（_）和美元符号（$）构成，且第一个字符不能为数字； （3）变量的分类。在JavaScript中，变量有一定的作用域（也就是变