搜索
常州机电职业技术学院普通类课程教案授课章节第一章第一个JavaScript小程序1.1了解JavaScript1.2JavaScript执行原理1.3JavaScript的版本1.4脚本编写工具1.5编写第一个JAVASCRIPT授课形式讲授授课时间第1周周2（8月30日）第7至8节教学目标知识目标：掌握脚本的基本结构(Script标签)简单记忆基本语法变量的定义与赋值数据类型与转换parseFloat等运算符和控制语句同Java灵活运用高级语法－自定义函数function能力目标：掌握函数的用法。素质目标：能根据功能分析出哪里需要添加函数。教学重点回顾静态网页相关知识。掌握函数的用法。教学难点能根据功能分析出哪里需要添加函数。补充内容无教学场地及教具使用多媒体教室电脑投影pptdreamweaverMx2004教学过程方法手段时间分配导入组织教学,点名回顾HTML，它的基本元素。为什么还要学习JS？讲述10常州机电职业技术学院普通类课程教案新课第一个JavaScript小程序1.1了解JavaScript什么是JavaScript为什么要学JavaScript1.2JavaScript执行原理在脚本的执行过程中，浏览器客户端与应用服务器采用请求/响应模式进行交互分解这个过程为1）浏览器接收用户的请求：2）向服务器请求某个包含JavaScript脚本的页面3)应用服务器端向浏览器发送响应信息，即把含有脚本的HTML文件发送到浏览器客户端，然后由浏览器从上到下逐条解析HTML标签和JavaScript脚本，并显示页面效果呈现给用户。使用客户端脚本的好处有以下两点：a)含脚本的页面只要下载一次，减少不必要的网络通信。b）脚本程序是浏览器客户端执行，而不是由服务器执行，因此可以减轻服务器端的压力。1.3JavaScript的版本JavaScript语言最初在Netscape2.0上发布，此后不断发展，陆续推出了多个版本：JavaScript1.0到JavasScript1.6。其中JavaScript1.5,InternetExplorer6.0支持，Netscape6.0和Firefox1.0支持。JavaScript1.6目前有firefox1.5支持。1.4脚本编写工具记事本FrontPageDreamweaver1.5写第一个JavaScript工作任务3：写出第一个含有JavaScript的html，功能是弹出一个对话框，并调试成功！讲授20知识扩展：无练习或训练工作任务3：写出第一个含有JavaScript的html，功能是弹出一个对话框，并调试成功！注意Dreamweaver的使用和JavaScript调试方法40课后小结15布置作业课后实战题15常州机电职业技术学院普通类课程教案授课章节1.6JavaScript的基本语法1.6.1变量声明和赋值1.6.2运算符号授课形式现场教学授课时间第1周周4（9月1日）第5至6节教学目标知识目标：掌握变量声明和赋值方法。能力目标：编写调用简单的JS代码，完成一定功能。素质目标：能根据功能分析出编程步骤，并在规定实践完成。教学重点运用变量声明和赋值知识,编写调用简单的JS代码，完成一定功能。教学难点能根据功能分析出编程步骤，并在规定实践完成。补充内容无教学场地及教具使用机房电脑dreamweaverMX2004教学过程方法手段时间分配导入组织教学,点名回顾JS基本知识。JavaScript的执行原理是什么?分成几个步骤?大家简述一下JavaScript脚本的基本结构？常用的JavaScript编写工具是什么?如何调试JavaScript程序?讲述10常州机电职业技术学院普通类课程教案新课1.6Javascript的基本语法1.6.1变量的声明和赋值在JavaScript中，变量的命名规则与Java相同。JavaScript是一种弱类型语言，也就是在变量声明时不需要指定变量类型，变量的类型会由赋给变量的值决定。1.6.2运算符号运算符对一个或多个变量或值（操作数）进行运算，并返回一个新值根据所执行的运算，运算符可分为以下类别：1）算术运算符用于连接运算表达式。算术运算符包括加（+）、减（−）、乘（*）、除（/）、取模（%）、自加（++）、自减（--）等运算符2）比较运算符用来连接操作数来组成比较表达式。比较运算符的基本操作过程是：首先对操作数进行比较，然后返回一个布尔值true或false。包括、、=、=、==、!=3)JavaScript支持的常用逻辑运算符,包括！、||、&&4)赋值运算符，包括=、+=、—=、*=、/=变量声明和赋值现场教学20知识扩展：无练习或训练使用变量和运算符,实现如下运算a=1,b=2,a+b=3c=”hello”d=”you”c+d=”helloyou”e=false!e=true40课后小结15布置作业课后实战题25常州机电职业技术学院普通类课程教案授课章节1.6.3逻辑控制语句1.6.4注释授课形式现场教学授课时间第2周周2（9月6日）第7至8节教学目标知识目标：掌握分支语句和循环语句的语法结构。能力目标：编写调用简单的JS代码，实现分支结构和循环结构。素质目标：能灵活运用分支和循环结构解决实际编程问题。教学重点使用分支语句使用循环语句教学难点循环语句和分支语句补充内容无教学场地及教具使用多媒体教室电脑投影pptdreamweaverMx2004教学过程方法手段时间分配导入组织教学,点名JavaScript中的变量声明和Java中的区别是什么，什么样的名字可以作为变量名使用?JavaScript语言区分大小写吗?JavaScript有哪些赋值符号。讲述10常州机电职业技术学院普通类课程教案新课1.6.3逻辑控制语句1）条件语句if语句是最基本、最常用的条件控制语句，语法：if(expression){statement}2）switch语句switch是典型的多路分支语句语法：switch(expression){casejudgement1:statement1;break;…default:defaultstatement;break;}4）for语句5）while语句while语句是基本的循环语句，也是条件判断语句。语法：while(expression){statement}现场教学20知识扩展：无练习或训练用while循环语句将指定的字符串进行输出利用脚本实现宝石图形。40课后小结15布置作业课后实战题3.45常州机电职业技术学院普通类课程教案授课章节2.1函数基础2.2什么是函数2.3简易购物车实现授课形式现场教学授课时间第2周周4（9月8日）第5至6节教学目标知识目标：定义函数、调用函数、能实现事件响应能力目标：编写调用简单的JS函数，完成一定功能。素质目标：能根据功能分析出编程步骤，并在规定实践完成。教学重点编写调用简单的JS函数，完成一定功能。教学难点能根据功能分析出编程步骤，并在规定实践完成。补充内容无教学场地及教具使用机房电脑dreamweaverMX2004教学过程方法手段时间分配导入组织教学，点名根据分数给出学生获得的等级，使用什么结构？实现连续十个学生的等级评价，使用什么结构？观看一个购物车特效，可以自动计算购物金额，如何实现呢？引出函数的概念和函数调用的概念。讲述10常州机电职业技术学院普通类课程教案新课2.1函数基础工作任务1编写函数functionsum(number1,number2)求两数之和，弹出结果。并调用之。2.2什么是函数函数实质上就是可以作为一个逻辑单元对待的一组相关JavaScript语句。在JavaScript程序中使用函数可以使代码更为简洁并具有重用性能。2.2.1函数的定义函数是由关键字function、函数名加一组参数以及置于大括号中需要执行的一段语句定义的。函数与其他的JavaScript代码一样，必须位于SCRIPT/SCRIPT标记之间，函数的基本语法。。2.2.2函数调用函数调用的语法2.3简易购物车实现现场教学20知识扩展：无练习或训练40课后小结20布置作业课后实战题1常州机电职业技术学院普通类课程教案授课章节2.4四则运算计算器授课形式现场教学授课时间第3周周2（9月13日）第7至8节教学目标知识目标：有参函数的定义和调用，事件响应能力目标：编写调用简单的有参数JS函数，完成一定功能。素质目标：能根据功能分析出编程步骤，并在规定实践完成。教学重点编写调用简单的JS函数，完成一定功能。教学难点能根据功能分析出编程步骤，并在规定实践完成。补充内容无教学场地及教具使用机房电脑dreamweaverMX2004教学过程方法手段时间分配导入组织教学，点名JavaScript函数定义和调用的语法点击按钮实现功能如何调用JavaScript函数讲述10常州机电职业技术学院普通类课程教案新课制作四则运算计算器。本题需要使用函数参数传递。在JavaScript中定义函数的完整格式如下：语法function自定义函数名(形参1,形参2,……){函数体}在定义函数时，在函数名后面的圆括号内可以指定一个或多个参数（用逗号“,”分隔）。指定参数的作用在于当调用函数时可以为被调用的函数传递一个或多个值。我们把定义函数时指定的参数称为形式参数，简称形参；而把调用函数时实际传递的值称为实际参数，简称实参。如果定义的函数有参数，那么对这种函数的调用形式就是：函数名（实参1，实参2，……）通常，如果在定义函数时使用了多少个形参，那么在函数调用时也必须给出多少个实参（这里需要注意的是，在实参之间也必须用逗号“,”分隔。）functioncompute(op){…….}这里op代表进行何种运算。所以调用的时候，也相应的给予参数onClick=compute('+')现场教学20知识扩展：无练习或训练实现特效40课后小结15布置作业课后实战题25常州机电职业技术学院普通类课程教案授课章节2.5用链接代替按钮响应点击事件授课形式讲授+现场教学授课时间第3周周4（9月15日）第5至6节教学目标知识目标：超链接如何实现像按钮一样的功能。能力目标：编写调用简单的有参数JS函数，用超链接点击实现响应，完成一定功能。素质目标：能根据功能分析出编程步骤，并在规定实践完成。教学重点用超链接实现按钮一样的功能。教学难点无。补充内容无教学场地及教具使用机房电脑dreamweaverMX2004教学过程方法手段时间分配导入组织教学，点名JavaScript中如何定义和调用有参函数。按钮点击调用函数如何实现？如何用超链接取代按钮？讲述15常州机电职业技术学院普通类课程教案新课点击超链接实现按钮功能，改变html的页面背景色。函数除了可以在响应事件中被调用之外，还可以在链接中被调用。在a标签中的href标记中使用javascript:关键字调用函数，当用户单击这个链接时，相关函数将被执行。ahref=javascript:change('b')functionchange(color){if(color==r){document.bgColor=red;}elseif(color==b){document.bgColor=blue;}elseif(color==g){document.bgColor=green}}现场教学40知识扩展：无练习或训练把建议购物车的“计算金额”按钮变成超链接看能否实现相同的效果？20课后小结15布置作业P80一二5常州机电职业技术学院普通类课程教案授课章节2.6JAVASCRIPT的内置函数授课形式现场教学授课时间第4周周2（9月20日）第7至8节教学目标知识目标：常见函数parseInt()，isNaN()和parseFloat()能力目标：能使用内置函数实现数值转换，获得表单元素。素质目标：能根据功能分析出编程步骤，并在规定实践完成。教学重点能利用内置函数判断输入是否为数值，能将字符串转换为整数或浮点数教学难点无。补充内容无教学场地及教具使用机房电脑dreamweav