学习情境1：设计一个典型的网站框架 1
工作任务 1
技能目标 1
1.1 任务描述 1
1.2 任务实施 2
1.2.1制作模板并应用到其他页面 2
1.2.2制作样式表文件并应用到其他页面 9
1.2.3测试并发布网站 17
1.3常见问题及小结 20
1.4 课后练习 21
学习情境2：网站中购物计算器的实现 23
工作任务 23
技能目标 23
2.1 任务描述 23
2.2 任务实施 24
2.2.1 什么是JavaScript 24
2.2.2 JavaScript的基本语法 30
2.2.3 JavaScript中函数的定义和应用 40
2.2.4 简单购物计算器设计及实现 45
2.3 常见问题及小结 48
2.4 课后练习 49
学习情境3：实现网站中动态时钟效果的显示 52
工作任务 52
技能目标 52
3.1任务描述 52
3.2任务实施 52
3.2.1 DOM模型介绍 52
3.2.2 window对象常用的属性、方法和事件 55
3.2.3 使用Date对象做动态时钟显示效果 62
3.2.4 地址栏location对象的用法 65
3.3常见问题及小结 66
3.4 课后练习 67
学习情境4：网页中浮动广告效果的制作 70
工作任务 70
技能目标 70
4.1任务描述 70
4.2任务实施 70
4.2.1 document对象常用的属性和方法介绍 70
4.2.2浮动广告图片的制作 73
4.2.3 带关闭按钮的浮动窗口 78
4.2.4 带关闭按钮随滚动条同步滚动的浮动广告窗口 81
4.3常见错误分析及小结 84
4.4 课后练习 85
学习情境5：快捷方式全选/全不选功能的实现 87
工作任务 87
技能目标 87
5.1任务描述 87
5.2任务实施 87
5.2.1 document对象的方法getElementsByName( )介绍 87
5.2.2 数组的基础知识 88
5.2.3复选框全选/全不选特效 91
5.3 常见问题及小结 95
5.4课后练习 96
学习情境6：实现多样化的CSS样式特效 99
工作任务 99
技能目标 99
6.1任务描述 99
6.2任务实施 99
6.2.1常用的CSS样式表 99
6.2.2制作改变字体大小的样式特效 105
6.2.3制作改变细边框的样式特效 110
6.2.4制作改变按钮背景图片的特效 114
6.3常见问题及小结 118
6.4课后练习 118
学习情境7：经典切换效果的实现 121
工作任务 121
技能目标 121
7.1任务描述 121
7.2任务实施 121
7.2.1知识回顾 121
7.2.2制作”点卡“图片切换的特效 122
7.2.3 制作贷款系统计算器 127
7.3 常见问题及小结 133
7.4课后练习 133
学习情境8：简单的客户端验证功能的实现 137
工作任务 137
技能目标 137
8.1任务描述 137
8.2任务实施 137
8.2.1为什么要进行表单验证 137
8.2.2表单验证的主要内容 138
8.2.3表单验证思路 139
8.2.4 电子邮件格式验证的优化 151
8.3常见问题及小结 155
8.4课后练习 156
学习情境9：经典客户端验证即时错误提示的实现 158
工作任务 158
技能目标 158
9.1任务描述 158
9.2任务实施 158
9.2.1 实现图片代替按钮实现提交功能 158
9.2.2 制作回车切换输入的效果 161
9.2.3 制作即时错误信息提示效果 167
9.3常见问题及小结 176
9.4课后练习 176
学习情境10：通用的级联菜单效果的制作 178
工作任务： 178
技能目标： 178
10.1任务描述 178
10.2任务实施 178
10.2.1下拉列表框对象 179
10.2.2数组 180
10.2.3制作简单的级联菜单效果 183
10.2.4使用数组优化级联菜单 184
10.2.5制作级联菜单效果过程 185
10.3常见错误分析及小结 186
10.4课后练习 186