版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领
文档简介
.《HTML5页编程》教教页本次课题：情景一JavaScript基应用任务JavaScript语言础语授课班
案授课日上课地
第1第1次实验楼L区课时分教
能力目
面面转堂学2课时（分钟知识目学
、会利用JS本语法完成程序控制流程。1掌握JS基语目
、会编写函数；
、掌握函数定义方法标学习者特征分析教学任务重点难点
、会选择相应事件调用函数。、掌握自定义函数的调用大部分学生学习态度较好，学习意愿强，但自主学习能力不强；学生学习热情较高，能在论坛上提出问题；教学任务：语基础应用案例：精品课程网站首页中建立用户名、密码登陆框。重点：函数编写难点：自定义函数编写及控制语句编写；
.作业或考核参考资料
编写输出五行星号程序。《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节任务1JS语基础教
学生自主学习
学视频学习；JavaScript简介学习；JavaScript语法学习；
上传视频件相关资料；
观看视频
分
在线学习时长简单案例学习；
在线测试完成任务作业
完成任务在测试题利用循环输出“行文到网页中
教师发布题目出成绩并分析结果批阅作业
在线测试完成作业
分分
在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下JS语编
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
10分10分
线上统计结果与抽查结果测试成绩与课前作业成疑
写规则
讲
绩3
课堂任务下达
教师给出课堂完成的任务用JS完杨辉三角输出
布置任务巡回答疑
分析任务
10分
任务理解情况4
分小组完成任务
1）编写程序算法；2）循环语句设计；3）输出内容到文档中
实战演巡回指导练30分钟分组讨论
任务完成情况小组互评；
确定得分依5
小组评价
评价内容：能否设计循环语句；
观摩；互答；
据；记录结
20分
小组协作与沟通能力能否正确输出文档
果；6
小组优秀作品展示
展示运行结果；展示设计思路；并分析小组分工与团队配合情况。
观摩；反思；
学生展示；认真听讲15分钟记录；
本次任务综合评价（完成率及创新点）
.78
教师总结与引导布置下次课前要学
总结小组任务情况并给予小组点评；总结表单操作流程与规范布置下次课前要学习的任务：任务1制
讲授告知
认真听讲记录；反思记录
15分10分
线上作业与在线测试完成情况习的任务——课后：反思总结及拓展提升教与学环节教师写教学1
反思总结
JavaScript与其编程语言相似点分析
总结务难度学生吸收率；
学生进行自发交流总结
20分
日志；学生写学习笔记答疑分享2
拓展
JS控制语句语法拓展学习
教师予课外源；当引导习，
学生进行自主探索学习
20分
.教容一、学习目标掌握脚本的基本结构Script标签简单记忆基本语法变量的定义与赋值数据类型与转换parseFloat等运算符和控制语句同ava二、什么是avaScript<HTML><HEAD><TITLE>脚本的基本结构</TITLE><SCRIPTlanguage="javascript">varcount=0;淘网欢迎您");for(i=0;i<5;i++)document.write("<H2>淘网欢迎您</H2>");</SCRIPT></HEAD><BODY><H1>BODY部分的内容</H1></BODY></HTML>
.三、语法：变量的声明和赋值“var”－用声明变量的关键字“count”－变量运算符对一个或多个变量或值（操作数）进行运算，并返回一个新值根据所执行的运算，运算符可分为以下类别：算术运算符+、、、/、、++、、求反)比较运算符==、!=、、>=、、逻辑运算符&&、、if条件语句switch多分支语句for、循语多行注释以/*开始，以*/结，符号/*…*/指示间的语句是该程序中的注释。例如：/*helloWorld.html第一个JavaScript程序*/<!-注释内容->单行注释以//开始，以行末结例如：<SCRIPTlanguage=“javascript”>//示JavaScript码的开始parseInt(String)将字符串转换为整型数字如parseInt(“86”将符86”转换为整型86parseFloat(String)将字符串转换为浮点型数字如parseInt(“34.45”将符串34.45转换为浮点34.45四、总结提问循结的点什？循和o-while循有什区？
教页本次课题：情景一JavaScript基应用任务JavaScript语言础任制作
授课日
.第1第2次授课班
）班
上课地
实验楼L区课时分
面面转堂学2课时（分钟教学目标学习
能力目、会编写自定义函数；、会选择相应事件调用函数。
知识目、掌握函数语法格式。、掌握函数定义方法、掌握自定义函数的调用者特征分析教学任务重点难点作业或考核参考资料
大部分学生学习态度较好，学习意愿强，但自主学习能力不强；学生学习热情较高，能在论坛上提出问题教学任务：语基础应用案例：实现两个数的计算器的加减乘除。重点：函数编写难点：自定义函数编写及控制语句编写；编写输出五行星号程序。《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节任务1JS语基础教
学生自主学习
学视频学习；JavaScript语法学习；
上传视频件相关资料；
观看视频
分
在线学习时长简单案例学习；
在线测试
完成任务在测试题
教师发布题目出成绩并分析结果
在线测试
分
在线测试成绩如何希望点击某个按钮
完成任务作业
后才显“，并能输入显示的次数
批阅作业
完成作业
分
作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节公布学生线上学习情12
自主学习检查与讨论课前学习总结与答疑
况；抽查视频相关知识点函数的含义现场答疑；创建函数
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听讲
10分10分
线上统计结果与抽查结果测试成绩与课前作业成绩教师给出课堂完成的任3
课堂任务下达
务:编具有能对两个布任务操作数进行加、减、乘、巡答疑除运算的简易计算器。
分析任务10分
任务理解情况45
分小组完成任务小组评价
编写程序算法；4个钮调用的函数的代码很类似，怎么优化代码小组互评；评价内容：优化代码能否正确输出文档
巡回指导观摩；互答；
实战演练；分组讨论确定得分依据；记录结果；
30分20分
任务完成情况小组协作与沟通能力
.6
小组优秀作品展示
展示运行结果；展示设计思路；并分析小组分工与团队配合情况。
观摩；反思；
学生展示；认真听讲15分钟记录；
本次任务综合评价（完成率及创新点）7
教师总结与引导
总结小组任务情况并给予小组点评；总结表单操作流程与规范
认真听讲讲授记；15分反思布置下次
布置下次课前要学习的
线上作业与8
课前要学
任务：情景二任务2DOM
告知
记录
10分
在线测试完模型-window对
成情况习的任务——课后：反思总结及拓展提升教与学环节教师写教学1
反思总结
JavaScript与其编程语言相似点分析
总结务难度学生吸收率；
学生进行自发交流总结
20分
日志；学生写学习笔记答疑分享2
拓展JS语法拓展学习
教师予课外源；当引导习，
学生进行自主探索学习
20分
.教容一、函数的含义：类似于Java中方法，是执行特定任务的语句块。问题：如何希望点击某个按钮后才显示HelloWorld”，并能输入显示的次数，怎么办？二、分析问题：1、在页面中放置一个文本框和个按钮，让用户输入次数后点击按钮才显示2、把循环显示的代码放置到函中，当点击按钮时，才调用函数显HelloWorld经过分析，该如何解决上面问题？三、核心代码分:functionshowHello({varcount=document.myForm.txtCount.valuefor(i=0;i<count;i++)document.write("<H2>HelloWorld</H2>");}四、总结提问大简一JavaScript本基结？与Java本法哪些同处在JavaScript中如定一函？在JavaScript中如调一函？在，见误哪？循结的点什？循和o-while循有什区？
.教页本次课题：
情景一JavaScript基应用
授课日
第2第1次任务2DOM编程－window对属性与方法授课班
）班
上课地
实验楼L区课时分
面面转堂学2课时（分）教学目标学习者
能力目、会使用模查找元素、会使用open（方法制作各种广告特效、会使用（方法和对制作日期和时间显示
知识目、熟悉文档模型、熟悉window对的各种属性特征分析教学任务重点难点作业或考核参考资料
学生学习基础一般，缺乏动手实践能力大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：window对编程案例：精品课程网站首页中实现弹出对话框。重点：window对函数应用难点：window对函数应用编写编写打开精品课程首页同时自动弹出欢迎广告窗口。《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节任务2DOM模型——window对象教学视频学
学生自主学习
习；DOM模型学习；Window属学习；
上传视频件等相关资料；
观看视频
分
在线学习时长Window方学习；简单案例学习；
在线测试完成任务作业
完成任务在测试题输出输入非法数字弹出窗口警告
教师导出成绩并分析结果批阅作业
在线测试完成作业
分分
在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下window对
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
象函数
讲
绩3
课堂任务下达
教师给出课堂完成的任务完广告窗口特效
布置任务巡回答疑
分析任务
5分
任务理解情况（）计主页面；4
分小组完成任务
（）计广告窗口（）写js函；（）加事件处理事
巡回指导
实战演练；分组讨论
20分
任务完成情况件（）面效果是否实
确定得分依5
小组评价
现；（）Js函主体功能
观摩；互答；
据；记录结
10分
小组协作与沟通能力是否实现
果；6
小组优秀
学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。
观摩；反思；
学生展示；认真听讲记录；
5分
本次任务综合评价（完成率及创新
作品展示
.点）7
教师总结与引导
总结小组任务情况并给予小组点评；总结表单操作流程与规范
认真听讲讲授记；5钟反思布置下次
布置下次课前要学习的
线上作业与8
课前要学
任务二任3DOM
告知
记录5分
在线测试完编程－对
成情况习的任务——课后：反思总结及拓展提升教与学环节1
反思总结
总结案例的贯彻作用。
反思录课堂例引是否符学生认知规律
学生进行自发交流总结
20分
教师写教学日志；学生写学习笔记答疑分享2
拓展JS的dom模拓展学
教师予课外源；当引导习，
学生进行自主探索学习
20分
.教容一在平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二布课堂任务单任介：一、相知识点、javascript基本语、变量的命名规则、变量的使用
.、数据类型、现场编程使变存以MP3信，打输品（brand：爱国重（weight：12.4电类（）：置电
.价（price）、总结提问什是算程？什是量JavaScript常的据型哪？简JavaScript脚本基结？在avaScript，见误哪？
.教页本次课题：
情景一JavaScript基应用
授课日
第2第2次任务2DOM编－window对象任务制作授课班
）班
上课地
实验楼L区课时分
面面转堂学2课时（分）教学目标学习者
能力目、会使用模查找元素、会使用open（方法制作各种广告特效、会使用（方法和对制作日期和时间显示
知识目、熟悉文档模型、熟悉window对的各种属性特征分析教学任务重点难点作业或考核参考资料
学生学习基础一般，缺乏动手实践能力大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：window对编程案例：精品课程网站首页中实现弹出对话框。重点：window对函数应用难点：window对函数应用编写编写打开精品课程首页同时自动弹出欢迎广告窗口。《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节任务2DOM模型——window对象教学视频学
学生自主学习
习；DOM模型学习；Window属学习；
上传视频件相关资料；
观看视频
分
在线学习时长Window方学习；简单案例学习；
在线测试完成任务作业
完成任务在测试题输出输入非法数字弹出窗口警告
教师导出成绩并分析结果批阅作业
在线测试完成作业
分分
在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节123
自主学习检查与讨论课前学习总结与答疑课堂任务下达
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下Date对教师给出课堂完成的任务完广告窗口特效
抽取学生记录指导总结学生学习情况一对一答疑布置任务巡回答疑
认真演示认真观看学生提问；认真听讲分析任务
5分5分5分
线上统计结果与抽查结果测试成绩与课前作业成绩任务理解情况对做时钟显示；4
分小组完成任务
使用setTimeout()方法每隔1秒用显示时间巡指导的方法
实战演练；分组讨论
20分
任务完成情况56
小组评价小组优秀
页面效果是否实现；Js函数主体功能是否实现学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。
观摩；互答；观摩；反思；
确定得分依据；记录结果；学生展示；认真听讲记录；
10分5分
小组协作与沟通能力本次任务综合评价（完成率及创新
作品展示
.点）7
教师总结与引导
总结小组任务情况并给予小组点评；总结表单操作流程与规范
认真听讲讲授记；5钟反思布置下次
布置下次课前要学习的
线上作业与8
课前要学
任务二任3DOM
告知
记录5分
在线测试完编程－对
成情况习的任务——课后：反思总结及拓展提升教与学环节1
反思总结
总结案例的贯彻作用。
反思录课堂例引是否符学生认知规律
学生进行自发交流总结
20分
教师写教学日志；学生写学习笔记答疑分享2
拓展JS的dom模拓展学
教师予课外源；当引导习，
学生进行自主探索学习
20分
.一
教容在线平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二
布置课堂任务单任介：二、相知识点HTML档树结DOM对象型
.、浏器象分结4、Window象用属
.Date象储日为年月1日00:00:00以来毫数var=newDate();date
教页本次课题：情景一JavaScript基础应用任务3DOM编－document对象属性与方法
授课日
.第3第1次授课班
）班
上课地
实验楼K区课时分
面面转堂学2课时（分钟教学目标学习
能力目、会使用模查找元素、会使用对象制作浮动的各种广告特效、会完成表单的全选、全不选特效
知识目、掌握对的重要方法、掌握style式调用者特征分析教学任务重点难点作业或考核参考资料
学生在上次课的基础上，已经基本掌握了DOM模。学生学习基础一般，缺乏动手实践能力大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：实现滚动的广告窗口特效案例：精品课程网站首页中实现浮动的欢迎进入等条幅。重点：Document对函数应用难点：Document对函数应用编写编写打开精品课程首页同时自动弹出浮动的欢迎广告窗口。《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节任务3DOM模型——
学生自主学习
document对教学频学习；浮动的广告图片特效
上传视频件相关资料；
观看视频
分
在线学习时长层显示隐藏特效学习；
在线测试完成任务作业
完成任务在测试题输出输入非法数字弹出窗口警告
教师导出成绩并分析结果批阅作业
在线测试完成作业
分分
在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下document
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
对象函数
讲
绩3
课堂任务下达
教师给出课堂完成的任务:完带关闭按钮的浮动窗口特效
布置任务巡回答疑
分析任务
5分
任务理解情况1)在面中插入层，然4
分小组完成任务
后在层中插入图片2)编写脚本3)捕鼠标滚动事件，
巡回指导
实战演练；分组讨论
20分
任务完成情况改变层对象的位置坐标56
小组评价小组优秀作品展示
1）页面特效是否实现2）脚本编写是否实现主要功能学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。
观摩；互答；观摩；反思；
确定得分依据；记录结果；学生展示；认真听讲记录；
10分5分
小组协作与沟通能力本次任务综合评价（完成率及创新点）
.会使用document对的7
教师总结与引导
getElementById(方法访问DIV层象会使用document对的getElementsByName方
讲授
认真听讲记录；反思
5分法访问表单元素8
布置下次课前要学习的任务
布置下次课前要学习的任务情景三JavaScript表单应用任务1基本的表单验证技术
告知
记录5分
线上作业与在线测试完成情况——课后：反思总结及拓展提升教与学环节1
反思总结
特效制作能否拓展
反思生能否翻转堂特效行一定的拓展
学生进行自发交流总结
20分
教师写教学日志；学生写学习笔记答疑分享2
拓展
JS的CSS样属性拓展学教师予课外资习；源；当引导学习，
学生进行自主探索学习
20分
.一
教容在线平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二
布置课堂任务单会使用象的getElementById(方法访问DIV层象会使用象的方法访问表单元素会使用DIV象的样式属性控制层的隐藏和显示任务介绍：三、相关知识点
根据HTML元素指定的ID，获得唯一的一个HTML元。如：访问DIV层象、图片Img对象根据HTML元指定的，获得同名称(
的一组元素。如：访问表单元(全选功能)如何在页面上方显示广告图片？如何控制图片的移动？
.实现思路：在页面中插入层，然后在层中插入图片编写脚本、使用)方法获取层对象、捕获鼠标滚动事件，改变层对象的位置坐标常见的页面坐标的介绍top:定元素的上边界位置。设置或返回元素的上边界。left:指定元的左边界位置。scrolltop:面滚动的高度<SCRIPTvaradvInitTop=0;functioninix(){}functionmove(){advInitTop+document.body.scrollTop;}window.onscroll=move;//页面滚动时调用)函数</SCRIPT><BODYonload="inix()"><DIVid="advLayer"
left:16px;width:144px;
height:95px;z-index:1;"><Awidth="180"height="230"</DIV>让关闭图标所在的层像浮动窗口一样，也跟随滚动条同步滚动。制作右边栏浮动的带关闭按钮的广告图片
教页本次课题：情景一JavaScript基础应用任务编程－document对象任务制作
授课日
.第3第2次授课班
）班
上课地
实验楼K区课时分
面面转堂学2课时（分钟教学目标学习
能力目、会使用模查找元素、会使用对象制作浮动的各种广告特效、会完成表单的全选、全不选特效
知识目、掌握对的重要方法、掌握style式调用者特征分析教学任务重点难点作业或考核参考资料
学生在上次课的基础上，已经基本掌握了DOM模。学生学习基础一般，缺乏动手实践能力大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：实现滚动的广告窗口特效案例：精品课程网站首页中实现浮动的欢迎进入等条幅。重点：Document对函数应用难点：Document对函数应用编写编写打开精品课程首页同时自动弹出浮动的欢迎广告窗口。《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节任务3DOM模型——
学生自主学习
document对教学频学习；浮动的广告图片特效
上传视频件相关资料；
观看视频
分
在线学习时长层显示隐藏特效学习；
在线测试完成任务作业
完成任务在测试题输出输入非法数字弹出窗口警告
教师导出成绩并分析结果批阅作业
在线测试完成作业
分分
在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下document
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
对象函数
讲
绩3
课堂任务下达
教师给出课堂完成的任务:完带关闭按钮的浮动窗口特效
布置任务巡回答疑
分析任务
5分
任务理解情况1)在面中插入层，然4
分小组完成任务
后在层中插入图片2)编写脚本3)捕鼠标滚动事件，
巡回指导
实战演练；分组讨论
20分
任务完成情况改变层对象的位置坐标56
小组评价小组优秀作品展示
3）页面特效是否实现4）脚本编写是否实现主要功能学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。
观摩；互答；观摩；反思；
确定得分依据；记录结果；学生展示；认真听讲记录；
10分5分
小组协作与沟通能力本次任务综合评价（完成率及创新点）
.会使用document对的7
教师总结与引导
getElementById(方法访问DIV层象会使用document对的getElementsByName方
讲授
认真听讲记录；反思
5分法访问表单元素8
布置下次课前要学习的任务
布置下次课前要学习的任务情景三JavaScript表单应用任务1基本的表单验证技术
告知
记录5分
线上作业与在线测试完成情况——课后反思总结及展提升教与环节1
反思总结
特效制作能否拓展
反思生能否翻转堂特效行一定的拓展
学生进行自发交流总结
20分
教师写教学日志；学生写学习笔记答疑分享2
拓展
JS的CSS样属性拓展学教师予课外资习；源；当引导学习，
学生进行自主探索学习
20分
.教容一在平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二
布置课堂任务单三、实现1、复选框是否选中的属性是哪个？2、写代码逐个复选框设置为true有没有更好的法？实现思路：创建一组同名的复选框编写脚本1、使用getElementsByName()方法获得一组名的复选框对象。2、通过循环来改变复选框是否被选中属性checked的值。<SCRIPTlanguage="javascript">functioncheckAll(boolValue{varallCheckBoxs=document.getElementsByName("isBuy")for(vari=0;i<allCheckBoxs.length;i++){if(allCheckBoxs[i].type=="checkbox")allCheckBoxs[i].checked=boolValue}}</SCRIPT>……<TR>
.<TDwidth="6%"><Ahref="javascript:checkAll(true)"><TDwidth="6%"><Ahref="javascript:checkAll(false)"></A></TD><TDwidth="88%"><IMGsrc="images/top.jpg"width="845"height="18"></TD></TR>
全选</TD>全不选……编写如左图所示，通过全选全不选前加个复选框实现全选/全不选切换的效果。
.教页本次课题：
情景一基应用
授课日
第4任务4CSS样特-内容分析授课班
）班
上课地
实验楼K区课时分
面面转堂学2课时（分）教学目标学习者
能力目会使用style样属性动态改变边框颜色会使用类属性动态改变按钮背景图片会使用display显示属性实现层或图片的隐藏示和切换特效
知识目1熟悉常用的样式属性2熟悉类属性3掌握显属性特征分析教学任务重点难点作业或考核参考资料
学生学习基础一般，缺乏动手实践能力大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：制作51job的出层效果案例：精品课程网站首页中实现的弹出层效果。重点：常用的样式属性应用难点：常用的样式属性应用与编写制”点“图切的效《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节
学生自主学习在线测试完成务作业
任务样特效教学视频学习；课件学习；完成任务在测试题制作”点卡图切换的特效。
上传视频件相关资料；教师导出成绩并分析结果批阅作业
观看视频在线测试完成作业
分分分
在线学习时长在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下样式属性
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
使用
讲
绩3
课堂任务下达
教师给出课堂完成的任务点切换
布置任务巡回答疑
分析任务
5分
任务理解情况（）用中入图4
分小组完成任务
片来实现；（）问图片对的方法（）用display属性
巡回指导
实战演练；分组讨论
20分
任务完成情况设置1）页面点卡切换实现
确定得分依5
小组评价
效果观；2）页面代码是否简洁，互；
据；记录结
10分
小组协作与沟通能力思路是否清晰
果；6
小组优秀作品展示
学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。
观摩；反思；
学生展示；认真听讲记录；
5分
本次任务综合评价（完成率及创新点）
.总结小组任务情况并给予小组点评；7
教师总结与引导
会使用className类名属性动态改变按钮背景图片会使用显属
讲授
认真听讲记录；反思
5分性实现层或图片的隐藏/显示和切换特效8
布置下次课前要学
布置下次课前要学习的任务：情景三
告知
记录5分
线上作业与在线测试完成情况习的任务——课后：反思总结及拓展提升教与学环节反思录翻转
教师写教学1
反思总结
翻转课堂任务
堂各环节是学生进行自存在问题务难发流总结
20分
日志；学生写学习度及学生吸收率；
笔记答疑分享2
拓展JS的dom模拓展学
教师予课外源；当引导习，
学生进行自主探索学习
20分
.教容一在平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二
布置课堂任务单任介：三、相关知识点：实现思路、创建改变样式J代码‘、利用鼠标相关事件调avaScript代onMouseOver="this.style.fontSize='24px'“onMouseOut="this.style.fontSize='14px'"实现思路名称不带下划线的超连接
说明A{text-decoration:red;}
.细边框样式图片按钮样式
.boxBorder{border-style:solid;}url(images/back2.jpg);0px;82px;font-size:14px;}
.教页本次课题：
情景一基应用
授课日
第4任务4CSS样特-任务制作授课班
）班
上课地
实验楼K区课时分
面面转堂学2课时（分）教学目标学习者
能力目会使用style样属性动态改变边框颜色会使用类属性动态改变按钮背景图片会使用display显示属性实现层或图片的隐藏示和切换特效
知识目1熟悉常用的样式属性2熟悉类属性3掌握显属性特征分析教学任务重点难点作业或考核参考资料
学生学习基础一般，缺乏动手实践能力大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：制作51job的出层效果案例：精品课程网站首页中实现的弹出层效果。重点：常用的样式属性应用难点：常用的样式属性应用与编写制”点“图切的效《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节
学生自主学习在线测试完成务作业
任务样特效教学视频学习；课件学习；完成任务在测试题制作”点卡图切换的特效。
上传视频件相关资料；教师导出成绩并分析结果批阅作业
观看视频在线测试完成作业
分分分
在线学习时长在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下样式属性
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
使用
讲
绩3
课堂任务下达
教师给出课堂完成的任务点切换
布置任务巡回答疑
分析任务
5分
任务理解情况（）用中入图4
分小组完成任务
片来实现；（）问图片对的方法（）用display属性
巡回指导
实战演练；分组讨论
20分
任务完成情况设置3）页面点卡切换实现
确定得分依5
小组评价
效果观；4）页面代码是否简洁，互；
据；记录结
10分
小组协作与沟通能力思路是否清晰
果；6
小组优秀作品展示
学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。
观摩；反思；
学生展示；认真听讲记录；
5分
本次任务综合评价（完成率及创新点）
.总结小组任务情况并给予小组点评；7
教师总结与引导
会使用className类名属性动态改变按钮背景图片会使用显属
讲授
认真听讲记录；反思
5分性实现层或图片的隐藏/显示和切换特效8
布置下次课前要学
布置下次课前要学习的任务：情景三
告知
记录5分
线上作业与在线测试完成情况习的任务——课后：反思总结及拓展提升教与学环节反思录翻转
教师写教学1
反思总结
翻转课堂任务
堂各环节是学生进行自存在问题务难发流总结
20分
日志；学生写学习度及学生吸收率；
笔记答疑分享2
拓展JS的dom模拓展学
教师予课外源；当引导习，
学生进行自主探索学习
20分
.教容一在平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二
布置课堂任务单任介：三、相关知识点：对象
.、制浮的告片实思：在面插层然在中入片编脚1、用getElementById(方获层象2、获标动件改层象位坐、层显/隐藏、制层显/隐藏特效
.、制右栏动带闭钮广
.教页本次课题：
情景二JavaScript表单应用
授课日
第5任务1基本的表单验证技术效果分析授课班
）班
上课地
实验楼K区课时分
面面转堂学2课时（分钟教学目标学习
能力目使用DOM模的层次关系访问元素使用表单事件和脚本函数实现表单验证使用String对和文本框控件常用属性和方法实现客户端验证
知识目握DOM模的层次关系握常见的表单事件和脚本函数握String对和文本框控件常用属性和方法者特征分析教学任务重点难点作业或考核参考资料
、学学习基础一，缺乏动手实践能力、大分学生学习度较好，学习意愿强，但自主学习能力不强教学任务：淘宝网店中会员注册表单验证重点：使表事和本数现单证难点：对象和本控常属的写编写打开精品课程后台登陆验证。《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节
学生自主学习在线测试完成任务作业
教学视频学习；课件学习；完成在线测试题精品课程后台登陆验证
上传视频件相关资料；教师导出成绩并分析结果批阅作业
观看视频在线测试完成作业
分分分
在线学习时长在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下表单任务
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
验证
讲
绩3
课堂任务下达
教师给出课堂完成的任务:完网店会员的表单任务验证
布置任务巡回答疑
分析任务
5分
任务理解情况4
分小组完成任务
1)表单取值2)对值进行处理3)添加事件处理
实战演巡回指导练20分分组讨论
任务完成情况1）验证表单是否符合
确定得分依5
小组评价
W3C标准2）验证表单是否满足
观摩；互答；
据；记录结
10分
小组协作与沟通能力验证字符。
果；6
小组优秀作品展示
学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。
观摩；反思；
学生展示；认真听讲记录；
5分
本次任务综合评价（完成率及创新点）7
教师总结与引导
总结小组任务情况并给予小组点评；总结表单取值调用方法；
认真听讲讲授记；5钟反思
布置下次
布置下次课前要学习的
.线上作业与8
课前要学
任务：表单验证的相关
告知
记录5分
在线测试完事件和辅助特效
成情况习的任务——课后：反思总结及拓展提升教与学环节1
反思总结
表单验证内容设计
反思录学生否熟掌握表验证
学生进行自发交流总结
20分
教师写教学日志；学生写学习笔记答疑分享2
拓展
JS的HTML5表处理拓展学习
教师予课外源；当引导习，
学生进行自主探索学习
20分
.一
教容在线平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二布课堂任务单任介：、相知识点常用的对使用var语var="这是我的字符串创建String对var=String("是我的字符串“调用方法和属性字符串对象.性名字符串对象.法(对常用的属性和方法对常用的属性和方法SCRIPTLANGUAGE="JavaScript">
.functioncheckEmail(){strEmail=document.myform.txtEmail.value;if(strEmail.length==0){alert("子邮件不能为!");}if{alert("子邮件格式不正必须包含符号！}if(strEmail.indexOf(".",0)==-1){alert("子邮件格式不正\须包符号！}}</SCRIPT>……“myformmethod=“post”action=“”onSubmit=“returncheckEmail(”>…name="registerButton"id="registerButton"value="注册"><SCRIPTlanguage="JavaScript">function//验证用户名var=document.myform.txtUser.value;if(fname.length0){varftextif(ftext<9||0){名中包含数字\n"+"删除名字中的数字和特殊字符");}}}else{alert("请输入“名字”文本"document.myform.txtUser.focus();}}
<SCRIPTlanguage="JavaScript">……function验证密码varuserpassif(userpass==""){未入密码\n"+"输入密码");}if(userpass.length<6){密必须多于或等于个符\n");}}……</SCRIPT><SCRIPTlanguage="JavaScript">……functionvalidateform(){if(checkUserName()&&passCheck())}</SCRIPT>……“
.method="post"……name="registerButton"id="registerButton"value="登录">
.教页本次课题：
情景二JavaScript表单应用
授课日
第5任务1基本的表单验证技术（）授课班
）班
上课地
实验楼K区课时分
面面转堂学2课时（分）教学目标学习
能力目使用正则表达式编写约束条件使用表单事件和脚本函数实现表单验证使用String对和文本框控件常用属性和方法实现客户端验证
知识目握正则表达式使用。见的表单事件和脚本函数握String对和文本框控件常用属性和方法者特征分析教学任务重点难点作业或考核参考资料
学生自行完成了在线测试和在线视频的学习。学生学习基础一般，缺乏动手实践能力。大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：淘宝网店中会员注册表单正则表达式验证重点：使正表式现单证难点：对象和本控常属的写编写打开精品课程后台登陆验证。《精通JavaScript+jQuery》民邮电出版社前沿科技《精通网样式与布局》，人民邮电出版社。温谦等《HTML+CSS网页设计与布局从入门到精通》，人民邮电出版社。温谦等《设彻底研究》人民邮电出版社。
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节
学生自主学习在线测试完成任务作业
教学视频学习；课件学习；完成在线测试题精品课程后台登陆验证
上传视频件相关资料；教师导出成绩并分析结果批阅作业
观看视频在线测试完成作业
分分分
在线学习时长在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下表单任务
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
验证
讲
绩34
课堂任务下达分小组完成任务
教师给出课堂完成的任务:完网店会员的表单任务验证表单取值对值进行正则表达式处理添加事件处理
布置任务巡回答疑巡回指导
分析任务实战演练；分组讨论
5分20分
任务理解情况任务完成情况验证表单是否符合W3C
确定得分依5
小组评价
标准验证表单是否满足验证
观摩；互答；
据；记录结
10分
小组协作与沟通能力字符。
果；6
小组优秀作品展示
学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。
观摩；反思；
学生展示；认真听讲记录；
5分
本次任务综合评价（完成率及创新点）7
教师总结与引导
总结小组任务情况并给予小组点评；总结表单取值调用方法；
认真听讲讲授记；5钟反思
布置下次
布置下次课前要学习的
.线上作业与8
课前要学
任务：表单验证的相关
告知
记录5分
在线测试完事件和辅助特效
成情况习的任务——课后：反思总结及拓展提升教与学环节1
反思总结
表单验证内容设计
反思录学生否熟掌握表验证
学生进行自发交流总结
20分
教师写教学日志；学生写学习笔记答疑分享2
拓展
JS的HTML5表处理拓展学习
教师予课外源；当引导习，
学生进行自主探索学习
20分
.一
教容在线平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二布课堂任务单任务介绍：、相知识点用的对使语var=这是我的字符串创String对象var=String("这是我的字符串调方法和属性字符串对象属性名字符串对象方法(对常用的属性和方法对象常用的属性方<LANGUAGE="JavaScript">
.functioncheckEmail(){varstrEmail=document.myform.txtEmail.value;if(strEmail.length==0){alert("子邮件不能为空");returnfalse;}if(strEmail.indexOf("@",0)==-1){alert("电邮件格式不正确必须包含符号！");returnfalse;}if(strEmail.indexOf(".",0)==-1){alert("电邮件格式不正确必须包含符号！");returnfalse;}returntrue;}</SCRIPT>……<FORMname=“myform”method=“post”action=“reg_success.htmonSubmit=“returncheckEmail()……<INPUTname="registerButton"type="submit"id="registerButton"value="注册><SCRIPTlanguage="JavaScript">function//验证用户名var=document.myform.txtUser.value;if(fname.length0){varftextif(ftext<9||0){名中包含数字\n"+"删除名字中的数字和特殊字"}}}else{alert("请输入名文本框);document.myform.txtUser.focus();}}<SCRIPTlanguage="JavaScript">……function验证密码varuserpassif(userpass==""){未入密码\n"+请输入密");
}if(userpass.length<6){密必须多于或等于个符\n");}}……</SCRIPT><SCRIPTlanguage="JavaScript">……functionvalidateform(){if(checkUserName()&&passCheck())}</SCRIPT>……onSubmit="returnvalidateform()“……name="registerButton"type="submit"value="登
.method="post"录"
.教页本次课题：情景二JavaScript表单应用任务2表验证的相关事件和辅特效果分析
授课日
第6授课班
）班
上课地
实验楼K区课时分
面面转堂学2课时（分钟教学目标
能力目会使用图片代替提交按钮会使用onKeyDown事检查用户输入的特殊字符会使用DIV的或innerText动态显示内容会使用多个DIV动态隐藏或显示
知识目握DOM模的层次系握常见的表单事件和脚本函数握String对和文本框控件常用属性和方法学习者特征分析教学任务重点难点作业或考核
内容学生已经学习了表单的基本知识，能基本制作静态页面。大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：淘宝网店中会员注册表单验证（用）重点：使用表单事件和脚本函数实现表单验证难点：对和文本框控件常用属性的编写编写打开精品课程后台登陆验证。
参考资料
.《网页设计技术》电子工业出版社《通》民邮电出版社
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节
学生自主学习在线测试完成任务作业
教学视频学习；课件学习；完成在线测试题精品课程后台登陆验证(onblur)
上传视频件相关资料；教师导出成绩并分析结果批阅作业
观看视频在线测试完成作业
分分分
在线学习时长在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下表单任务
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
验证
讲
绩3
课堂任务下达
教师给出课堂完成的任务:完网店会员的表单任务验证onblur)
布置任务巡回答疑
分析任务
5分
任务理解情况4
分小组完成任务
制作图片代替提交按钮制作回车切换输入
实战演巡回指导练20分分组讨论
任务完成情况确定得分依5
小组评价
1)评是否实现功能。观；2)是正确设计效果。互；
据；记录结
10分
小组协作与沟通能力果；6
小组优秀作品展示
1）展作品的功能实现2）展键盘事件是否正确
观摩；反思；
学生展示；认真听讲记录；
5分
本次任务综合评价（完成率及创新点）7
教师总结与引导
1、总小组任务情况并给予小组点评；2、实游戏中的人物移动效果
认真听讲讲授记；5钟反思
布置下次
布置下次课前要学习的
.线上作业与8
课前要学
任务：表单验证的相关
告知
记录5分
在线测试完事件和辅助特效
成情况习的任务——课后：反思总结及拓展提升教与学环节反思录翻转
教师写教学1
反思总结
翻转课堂任务
堂各环节是学生进行自存在问题务难发流总结
20分
日志；学生写学习度及学生吸收率；
笔记答疑分享2
拓展
JS的HTML5表处理拓展学习
教师予课外源；当引导习，
学生进行自主探索学习
20分
.一
教容在线平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二课任务单任务介绍：为了美观，现把提交按钮变成图片，但仍然保持表单的验证功能？如何实现？<SCRIPTfunctioncheckForm(){if({alert("用户名不能空document.myform.txtUserName.focus();}}</SCRIPT>……src="images/regquick.jpg"onClick="checkForm(会使用图片代替提交按钮
.会使用onKeyDown事检查用户输入的特殊字符会使用DIV或innerText态显示内容会使用多个DIV动态隐藏或显示内容<SCRIPTfunctioncheckForm(){if({alert("用户名不能空document.myform.txtUserName.focus();}}</SCRIPT>src="images/regquick.jpg"onClick="checkForm()">能进行表单验证，但即使是正确填写了表单，也不能提交页面（点击“注册”没反映）。因为图片不具备“提交”按钮的提交功能，所以需要人工调用提交方法－)。<SCRIPTfunctioncheckForm(){if({alert("用户名不能空document.myform.txtUserName.focus();}else{document.myform.submit();}}</SCRIPT>制作回车切换输入的效果
.输入完毕后回车，默认会提交表单。
页面效果如何制作回车Tab切效果？三、总结使用图片代替“提交按钮”时，如何实现表单验证功能？制作回车切特效的思路是什么？制作即时提示错误特效的思路是什么？制作内容动态改变的思路是什么？
.教页本次课题：情景二JavaScript表单应用任务2表验证的相关事件和辅特任务制作
授课日
第6授课班
）班
上课地
实验楼K区课时分
面面转堂学2课时（分钟教学目标
能力目会使用图片代替提交按钮会使用onKeyDown事检查用户输入的特殊字符会使用DIV的或innerText动态显示内容会使用多个DIV动态隐藏或显示
知识目握DOM模的层次系握常见的表单事件和脚本函数握String对和文本框控件常用属性和方法学习者特征分析教学任务重点难点作业或考核参考资料
内容学生已经学习了表单的基本知识，能基本制作静态页面。大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：淘宝网店中会员注册表单验证（用）重点：使用表单事件和脚本函数实现表单验证难点：对和文本框控件常用属性的编写编写打开精品课程后台登陆验证。《网页设计技术》电子工业出版社《通》民邮电出版社
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节
学生自主学习在线测试完成任务作业
教学视频学习；课件学习；完成在线测试题精品课程后台登陆验证(onblur)
上传视频件相关资料；教师导出成绩并分析结果批阅作业
观看视频在线测试完成作业
分分分
在线学习时长在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下表单任务
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
验证
讲
绩3
课堂任务下达
教师给出课堂完成的任务:完网店会员的表单任务验证onblur)
布置任务巡回答疑
分析任务
5分
任务理解情况4
分小组完成任务
制作图片代替提交按钮制作回车切换输入
实战演巡回指导练20分分组讨论
任务完成情况确定得分依5
小组评价
3)评是否实现功能。观；4)是正确设计效果。互；
据；记录结
10分
小组协作与沟通能力果；6
小组优秀作品展示
3）展作品的功能实现4）展键盘事件是否正确
观摩；反思；
学生展示；认真听讲记录；
5分
本次任务综合评价（完成率及创新点）7
教师总结与引导
3、总小组任务情况并给予小组点评；4、实游戏中的人物移动效果
认真听讲讲授记；5钟反思
布置下次
布置下次课前要学习的
.线上作业与8
课前要学
任务：表单验证的相关
告知
记录5分
在线测试完事件和辅助特效
成情况习的任务——课后：反思总结及拓展提升教与学环节反思录翻转
教师写教学1
反思总结
翻转课堂任务
堂各环节是学生进行自存在问题务难发流总结
20分
日志；学生写学习度及学生吸收率；
笔记答疑分享2
拓展
JS的HTML5表处理拓展学习
教师予课外源；当引导习，
学生进行自主探索学习
20分
.一
教容在线平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二课任务单任务介绍：为了美观，现把提交按钮变成图片，但仍然保持表单的验证功能？如何实现？<SCRIPTfunctioncheckForm(){if({alert("用户名不能空document.myform.txtUserName.focus();}}</SCRIPT>……src="images/regquick.jpg"onClick="checkForm(会使用图片代替提交按钮
.会使用onKeyDown事检查用户输入的特殊字符会使用DIV或innerText态显示内容会使用多个DIV动态隐藏或显示内容<SCRIPTfunctioncheckForm(){if({alert("用户名不能空document.myform.txtUserName.focus();}}</SCRIPT>src="images/regquick.jpg"onClick="checkForm(能进行表单验证，但即使是正确填写了表单，也不能提交页面（点击“注册”没反映）。因为图片不具备“提交”按钮的提交功能，所以需要人工调用提交方法－)。<SCRIPTfunctioncheckForm(){if({alert("用户名不能空document.myform.txtUserName.focus();}else{document.myform.submit();}}</SCRIPT>制作回车切换输入的效果
.输入完毕后回车，默认会提交表单。
页面效果如何制作回车Tab切效果？四、总结使用图片代替“提交按钮”时，如何实现表单验证功能？制作回车切特效的思路是什么？制作即时提示错误特效的思路是什么？制作内容动态改变的思路是什么？
.教页本次课题：授课班
情景二JavaScript表单应用任务3表单证的高级特-效分析）班
授课日上课地
第7实验楼K区课时分教
能力目
面面转堂学2课时（分钟知识目学目
会使用表单事件和脚本函数实现级联菜单验证会使用数组优化省市级联功能。
掌握的维组的使用；掌握下拉列表框控件实现省市级联功能标学习者特征分析教学任务重点难点作业或考核参考资料
学生学习基础一般，缺乏动手实践能力大部分学生学习态度较好，学习意愿强，但自主学习能力不强教学任务：淘宝网店中会员注册表单验证（用）重点：掌js的维组使难点：动创表选编写系部、专业二级菜单显示。《网页设计技术》电子工业出版社《通》民邮电出版社
.翻转课堂教学设计序号
步
骤
教学内
教师活（方法手段）
学生活
时间分配
评价标与方法——课：现代职教程平台线学习环节
学生自主学习在线测试完成任务作业
教学视频学习；课件学习；完成在线测试题完成二级菜单制作
上传视频件相关资料；教师导出成绩并分析结果批阅作业
观看视频在线测试完成作业
分分分
在线学习时长在线测试成绩作业等级判定
在线讨论
学生与学生、教师进行答回话题疑讨论
学生发帖，相互线上讨15分钟论
发帖数量与质量评价——课：面对面翻课堂教学环节12
自主学习检查与讨论课前学习总结与答
公布学生线上学习情况；抽查视频相关知识点现场答疑；重点提示一下表单任务
抽取学生记录指导总结学生学习情况一对一答疑
认真演示认真观看学生提问；认真听
5分5分
线上统计结果与抽查结果测试成绩与课前作业成疑
验证
讲
绩34567
课堂任务下达分小组完成任务小组评价小组优秀作品展示教师总结
教师给出课堂完成的任务:完系部与指导老师二级级联小组分工与协调完成任务单：代码编写人员及测试人员。小组互评；（相邻小组互相打分，分数现场公布）学生盘点收获与质疑问答；学生演示本次任务中的制作流程及优点所在，阐明自己不足之处。总结小组任务情况并给予小组点评；
布置任务巡回答疑巡回指导观摩；互答；观摩；反思；讲授
分析任务实战演练；分组讨论确定得分依据；记录结果；学生展示；认真听讲记录；认真听讲记录；
5分20分10分5分5分
任务理解情况任务完成情况小组协作与沟通能力本次任务综合评价（完成率及创新点）与引导
总结表单操作流程与规
反思
布置下次
范布置下次课前要学习的
.线上作业与8
课前要学
任务：表单验证的相关
告知
记录5分
在线测试完事件和辅助特效
成情况习的任务——课后：反思总结及拓展提升教与学环节反思录翻转
教师写教学1
反思总结
翻转课堂任务
堂各环节是学生进行自存在问题务难发流总结
20分
日志；学生写学习度及学生吸收率；
笔记答疑分享2
拓展
JS的HTML5表处理拓展学习
教师予课外源；当引导习，
学生进行自主探索学习
20分
.一
教容在线平台测试与作业点评公布学生在线平台测试与作业成绩，并点评。二课任务单任介：如何实现省市级联的效果？、利用省份下拉框选项改变事件onChange、根据用户选择的份，动态添加城市下拉框的值演示实步骤：、添加省份、城市拉框（演示素材）、
温馨提示
- 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 2025繁荣家园便利店超市特许加盟合同
- 2025年防火门供应与安装合同
- 2025年建筑防水卷材及制品项目合作计划书
- 2025办公室装修工程合同样本
- 2024年监理工程师考生真实反馈试题及答案
- 全媒体运营中的趋势预测技术试题及答案
- 如何有效提升注会考试复习效率试题及答案
- 物流服务外包模式试题及答案
- 2024年基金从业资格考试综合性模拟试题及答案
- 2024监理工程师复习建议试题及答案
- Unit 9 Kids and Computers公开课一等奖省优质课大赛获奖课件
- 截流式合流制管道系统的特点与使用条件课件
- （站表2-1）施工单位工程项目主要管理人员备案表
- 中班美术《我心中的太阳》绘画课件幼儿园优质课公开课
- 应急管理工作检查记录表
- 《雷锋叔叔你在哪里》教学案例
- DB32-T 2798-2015高性能沥青路面施工技术规范-（高清现行）
- 《机械设计基础》课程思政教学案例（一等奖）
- API-620 大型焊接低压储罐设计与建造
- 年产300吨莲子蛋白粉工厂的设计
- 箱变施工安全文明保证措施
评论
0/150
提交评论