第1章 JavaScript初探 1
学习目标 1
【知识目标】 1
【技能目标】 1
任务描述：实现商品详情展示 2
知识准备 2
1.1 JavaScript简述 2
1.1.1 JavaScript简史 2
1.1.2 JavaScript引擎的工作原理 3
1.1.3 JavaScript代码执行顺序 4
1.1.4 JavaScript的组成 5
1.1.5 JavaScript的主要特点 5
1.1.6 JavaScript相关应用 6
1.2 JavaScript编程起步 8
1.2.1 选择JavaScript脚本编辑器 8
1.2.2 引入JavaScript脚本代码到HTML文档中的方法 12
1.2.3 常用输出语句 16
任务实施 18
任务训练 20
【理论测试】 20
【实训内容】 21
第2章 JavaScript语言基础 23
学习目标 23
【知识目标】 23
【技能目标】 23
任务描述：实现猜数字游戏 24
知识准备 26
2.1 数据类型 26
2.1.1 数值型 26
2.1.2 字符串型 27
2.1.3 布尔型 28
2.1.4 特殊数据类型 28
2.1.5 数据类型的自动转换 30
2.2 变量 30
2.2.1 关键字 30
2.2.2 变量的定义与命名 31
2.2.3 变量的声明与赋值 31
2.3 函数 32
2.3.1 函数的定义与调用 32
2.3.2 带有返回值的函数 35
2.3.3 变量的作用域 37
2.4 内置函数 38
2.5 运算符与表达式 40
2.5.1 表达式 40
2.5.2 运算符 40
2.6 基本语句 46
2.6.1 注释语句 46
2.6.2 流程控制语句 46
2.6.3 异常处理语句 52
2.6.4 prompt（）方法 53
任务实施 54
任务训练 56
【理论测试】 56
【实训内容】 57
【实训拓展】 57
第3章 常用内置对象 59
学习目标 59
【知识目标】 59
【技能目标】 59
任务描述：实现简洁美观的计算器 60
知识准备 60
3.1 数组（Array）对象 60
3.1.1 新建数组 60
3.1.2 动态数组 61
3.1.3 数组对象的常用属性与方法 61
3.1.4 二维数组 64
3.2 日期（Date）对象 66
3.2.1 新建日期 66
3.2.2 日期对象的属性与方法 67
3.2.3 定时器函数 69
3.2.4 动态改变元素样式 69
3.2.5 日期对象应用案例 70
3.3 数学（Math）对象 73
3.3.1 使用数学对象 73
3.3.2 数学对象的属性与方法 74
3.3.3 数字的格式化与产生随机数 75
3.3.4 数学对象应用案例 75
3.4 字符串（String）对象 77
3.4.1 使用字符串对象 77
3.4.2 字符串相加 77
3.4.3 在字符串中使用单引号、双引号及其他特殊字符 78
3.4.4 比较字符串是否相等 78
3.4.5 字符串对象的属性与方法 79
3.4.6 字符串对象应用案例 80
3.4.7 字符串对象应用于表单 81
3.5 JavaScript正则表达式 85
3.5.1 正则表达式 85
3.5.2 创建正则表达式 85
3.5.3 正则表达式对象的方法 86
3.5.4 正则表达式中的常用符号 87
3.6 拓展：用户注册的实现 90
任务实施 96
任务训练 103
【理论测试】 103
【实训内容】 104
【实训拓展】 105
第4章 自定义对象及表格操作 107
学习目标 107
【知识目标】 107
【技能目标】 107
任务描述：学生成绩管理 108
知识准备 108
4.1 JavaScript自定义对象 108
4.1.1 JavaScript对象 108
4.1.2 JavaScript自定义对象建立方案 109
4.1.3 学生对象的建立 114
4.1.4 使用表单动态创建学生对象 115
4.1.5 遍历数组输出展示学生对象信息 118
4.2 动态表格 119
4.2.1 表格建立 119
4.2.2 动态插入行和单元格 119
4.2.3 动态删除某行 123
4.2.4 动态选中多行并删除 124
任务实施 131
任务训练 138
【理论测试】 138
【实训内容】 139
第5章 BOM和DOM 141
学习目标 141
【知识目标】 141
【技能目标】 141
任务描述：JavaScript实现带文字描述的图片相册 142
知识准备 142
5.1 JavaScript BOM 142
5.1.1 BOM概述 142
5.1.2 多窗口控制 145
5.1.3 浏览器（navigator）对象 150
5.1.4 屏幕（screen）对象 153
5.1.5 地址（location）对象 154
5.1.6 历史（history）对象 155
5.2 访问HTMLDOM对象 157
5.2.1 获取文档对象中元素对象的一般方法 159
5.2.2 元素的innerText、inner-HTML、outerHTML、outerText 161
5.2.3 修改HTML元素 162
5.2.4 导航节点关系 165
5.2.5 DOM优化 169
5.2.6 DOM事件 170
5.3 DOM扩展 173
5.3.1 querySelector（）与querySelectorAll（） 173
5.3.2 元素的遍历 175
5.3.3 classList属性 177
5.4 本地存储 178
5.4.1 JavaScript cookie 178
5.4.2 HTML5 Web Storage 181
任务实施 182
任务训练 184
【理论测试】 184
【实训内容】 185
第6章 项目实战：JavaScript实现在线测试系统 187
学习目标 187
【知识目标】 187
【技能目标】 187
任务描述：实现在线测试系统 188
知识准备 191
6.1 在线测试系统：页面架构 191
6.2 在线测试系统：页眉的设计与实现 191
6.2.1 页眉的结构描述 191
6.2.2 页眉元素及CSS样式代码分析 191
6.2.3 JavaScript实现显示日期及退出功能 193
6.3 在线测试系统：页面主体部分架构设计 194
6.4 在线测试系统：侧边导航的设计与实现 195
6.4.1 侧边导航的内容结构描述 195
6.4.2 侧边导航的样式设置 196
6.4.3 JavaScript实现导航功能及代码分析 198
6.5 在线测试系统：JavaScript实现用户登录 199
6.5.1 用户登录的内容结构描述 199
6.5.2 用户登录的样式设置 200
6.5.3 JavaScript实现用户登录居中显示效果 202
6.5.4 JavaScript实现用户登录验证功能 202
6.6 在线测试系统：用户密码修改的实现 204
6.6.1 用户密码修改的内容结构描述 204
6.6.2 用户密码修改的样式设置 204
6.6.3 JavaScript实现用户密码修改居中和锁屏功能 206
6.7 JavaScript实现原生Ajax应用 207
6.7.1 Ajax简介 207
6.7.2 原生JavaScript实现Ajax的步骤 208
6.7.3 Ajax实现在线测试系统远程验证—登录功能 215
6.7.4 JavaScript实现用户按角色登录功能 216
6.7.5 拓展：数据库操作实现 216
6.8 在线测试系统：在线测试功能模块的实现 218
6.8.1 在线测试功能模块的内容结构描述 219
6.8.2 在线测试功能模块的样式设置 219
6.8.3 JavaScript实现在线测试功能 219
6.8.4 JavaScript实现在线测试功能：页脚模块的实现 223
任务训练 223
【理论测试】 223
【实训内容】 224
【实训拓展】 224
第7章 jQuery基础 225
学习目标 225
【知识目标】 225
【技能目标】 225
任务描述：实现文字和图片提示效果 226
知识准备 226
7.1 jQuery简介 226
7.1.1 jQuery环境配置 227
7.1.2 jQuery应用的创建 229
7.1.3 jQuery对象与DOM对象的转换 232
7.2 jQuery常用选择器的应用 233
7.2.1 基本选择器 233
7.2.2 层次选择器 235
7.2.3 过滤选择器 241
7.3 jQuery控制页面 250
7.3.1 DOM元素的遍历 250
7.3.2 DOM元素属性操作及节点添加 254
7.3.3 DOM节点删除、复制和替换 258
7.4 jQuery事件 261
7.4.1 事件绑定与解除 263
7.4.2 复合事件 266
任务实施 267
任务训练 270
【理论测试】 270
【实训内容】 271
第8章 jQuery进阶 273
学习目标 273
【知识目标】 273
【技能目标】 273
任务描述：jQuery实现本地验证和远程验证 274
8.1 jQuery动画 275
8.1.1 元素的显示与隐藏 275
8.1.2 回调函数的使用 278
8.1.3 自定义动画 280
8.2 jQuery与Ajax 289
8.2.1 Ajax简介 289
8.2.2 load（）方法 290
8.2.3 ＄.get（）和＄.post（）方法 293
8.2.4 ＄.ajax（）方法 294
8.2.5 表单序列化 296
8.2.6 ＄.getScript（）和＄.getJSON（）方法 297
8.3 jQuery插件 301
8.3.1 插件简介 301
8.3.2 开发plugin 301
8.3.3 第三方插件的使用 306
任务实施 311
任务训练 315
【理论测试】 315
【实训内容】 316
【实训拓展】 316
第9章 项目实战：jQuery UI实现服饰网站 317
学习目标 317
【知识目标】 317
【技能目标】 317
任务描述：实现服饰网站 318
知识准备 319
9.1 jQuery UI插件 319
9.1.1 jQuery UI简介 319
9.1.2 jQuery UI使用：datepicker 320
9.1.3 jQuery UI使用：dialog 322
9.2 服饰网站：页眉的设计与实现 326
9.2.1 页眉元素及CSS样式代码设计 326
9.2.2 jQuery UI使用：button 328
9.3 服饰网站：页面主体部分的设计与实现 329
9.3.1 页面主体部分设计 329
9.3.2 菜单的设计 329
9.3.3 主体选项卡的设计 333
9.3.4 页脚模块的实现 339
9.4 服饰网站：商品详情页面的设计与实现 340
9.4.1 详情页面页眉设计 340
9.4.2 详情页面主体的内容结构描述 340
9.4.3 详情页面主体的样式设置 343
9.4.4 详情页面主体的功能实现 345
任务训练 347
【实训内容】 347
【实训拓展】 348
参考文献 349