JQUERY网页特效设计基础教程(慕课版)/刘刚

第 1章 JavaScript基础　1

1.1　JavaScript概述　2

1.1.1　什么是JavaScript　2

1.1.2　JavaScript的应用领域　2

1.1.3　JavaScript的特点　4

1.2　JavaScript的开发工具　5

1.2.1　使用记事本开发　5

1.2.2　使用Dreamweaver开发　5

1.3　编写第 一个JavaScript程序　8

1.3.1　编写JavaScript程序　8

1.3.2　运行JavaScript程序　10

1.3.3　JavaScript程序的出错类型　11

1.3.4　JavaScript的3种调试方式　12

1.4　JavaScript库　13

1.4.1　什么是JavaScript库　13

1.4.2　常用的JavaScript库　13

知识点提炼　15

习题　15

第　2章 初识jQuery　16

2.1　jQuery概述　17

2.1.1　jQuery的应用　17

2.1.2　jQuery的特点　18

2.1.3　jQuery的版本　19

2.1.4　jQuery版本的选择　21

2.2　jQuery下载与配置　21

2.2.1　下载jQuery　21

2.2.2　配置jQuery　22

2.2.3　我的第 一个jQuery脚本　22

2.3　jQuery对象和DOM对象　23

2.3.1　jQuery对象和DOM对象简介　23

2.3.2　jQuery对象和DOM对象的相互转换　24

2.4　解决jQuery和其他库的冲突　26

2.4.1　jQuery库在其他库之前导入　26

2.4.2　jQuery库在其他库之后导入　27

2.5　jQuery插件简介　28

2.5.1　插件的使用　28

2.5.2　流行的插件　28

知识点提炼　30

习题　31

第3章　使用jQuery选择器　32

3.1　jQuery的工厂函数　33

3.2　什么是jQuery选择器　33

3.3　jQuery选择器的优势　33

3.3.1　代码更简单　33

3.3.2　支持CSS1到CSS3选择器　33

3.3.3　完善的检测机制　33

3.4　基本选择器　35

3.4.1　ID选择器（#id）　35

3.4.2　元素选择器（element）　36

3.4.3　类名选择器（.class）　37

3.4.4　复合选择器（selector1，selector2，selectorN）　38

3.4.5　通配符选择器（*）　39

3.4.6　使用选择器获取超链接地址　39

3.5　层次选择器　41

3.5.1　ancestor descendant选择器　41

3.5.2　parent>child选择器　43

3.5.3　prev next选择器　44

3.5.4　prev～siblings选择器　45

3.6　过滤选择器　46

3.6.1　简单过滤器　46

3.6.2　内容过滤器　48

3.6.3　可见性过滤器　49

3.6.4　表单对象的属性过滤器　50

3.6.5　子元素过滤器　51

3.7　属性选择器　52

3.8　表单选择器　53

3.9　混淆选择器　54

3.10　选择器中的一些注意事项　55

3.10.1　选择器中含有特殊符号的注意事项　55

3.10.2　选择器中含有空格的注意事项　55

3.11　综合实例：表格隔行换色及鼠标指针指向行变色　56

知识点提炼　57

习题　58

第4章　使用jQuery操作DOM　59

4.1　DOM操作的分类　60

4.2　对元素内容和值进行操作　60

4.2.1　对元素内容进行操作　60

4.2.2　对元素值进行操作　63

4.3　对DOM文档节点进行操作　64

4.3.1　创建节点　64

4.3.2　查找节点　65

4.3.3　插入节点　65

4.3.4　删除、复制与替换节点　67

4.3.5　包裹节点　70

4.3.6　遍历节点　73

4.4　对元素属性进行操作　74

4.5　对元素的CSS样式进行操作　75

4.5.1　通过修改CSS类实现　75

4.5.2　通过修改CSS属性实现　75

4.6　综合实例：实现我的开心小农场　76

知识点提炼　77

习题　78

第5章　jQuery中的事件处理和动画效果　79

5.1　jQuery中的事件处理　80

5.1.1　页面加载响应事件　80

5.1.2　jQuery中的事件　80

5.1.3　事件绑定　82

5.1.4　模拟用户操作　85

5.1.5　事件捕获与事件冒泡　87

5.2　jQuery中的动画效果　91

5.2.1　隐藏匹配元素　91

5.2.2　显示匹配元素　91

5.2.3　切换元素的可见状态　93

5.2.4　淡入淡出的动画效果　93

5.2.5　滑动效果　94

5.2.6　自定义的动画效果　97

5.3　综合实例：实现图片传送带　99

知识点提炼　101

习题　102

第6章　使用jQuery操作表单和表格　103

6.1　HTML表单概述　104

6.1.1　表单标记　104

6.1.2　输入标记　105

6.1.3　文本域标记　109

6.1.4　菜单和列表标记、　110

6.2　使用jQuery操作表单元素　111

6.2.1　操作文本框　111

6.2.2　操作文本域　112

6.2.3　操作单选按钮和复选框　115

6.2.4　操作下拉框　117

6.2.5　表单验证　118

6.3　使用jQuery操作表格　120

6.3.1　控制表格颜色显示　120

6.3.2　表格的展开与关闭　122

6.3.3　表格内容的筛选　124

6.4　综合实例：删除记录时的提示效果　125

知识点提炼　126

习题　127

第7章　Ajax在jQuery中的应用　128

7.1　Ajax技术简介　129

7.1.1　Ajax概述　129

7.1.2　Ajax技术的优点　129

7.1.3　Ajax技术的缺点　130

7.2　安装Web运行环境——AppServ　130

7.3　通过JavaScript应用Ajax　133

7.4　jQuery中的Ajax应用　134

7.4.1　load()方法　135

7.4.2　使用$.get()方法请求数据　136

7.4.3　使用$.post()方法请求数据　137

7.4.4　使用$.getScript()方法加载JS文件　138

7.4.5　使用$.getJSON()方法加载JSON文件　139

7.4.6　使用$.ajax()方法请求数据　140

7.4.7　使用serialize()方法序列化表单　141

7.5　Ajax的全局事件　143

7.5.1　Ajax全局事件的参数及功能　143

7.5.2　ajaxStart与ajaxStop全局事件　143

7.6　综合实例：使用Ajax实现留言板即时更新　144

知识点提炼　146

习题　146

第8章　使用jQuery UI插件　147

8.1　初识jQuery UI插件　148

8.1.1　jQuery UI概述　148

8.1.2　jQuery UI的下载　148

8.1.3　jQuery UI的使用　149

8.1.4　jQuery UI的工作原理　150

8.1.5　jQuery UI中的插件　152

8.2　jQuery UI的常用插件　152

8.2.1　折叠面板（Accordion）的使用　152

8.2.2　自动完成（Autocomplete）插件的使用　155

8.2.3　按钮（Button）的使用　158

8.2.4　日期选择器（Datepicker）的使用　160

8.2.5　对话框（Dialog）的使用　163

8.2.6　菜单（Menu）的使用　166

8.2.7　进度条（Progressbar）的使用　168

8.2.8　滑块（Slider）的使用　170

8.2.9　旋转器（Spinner）的使用　172

8.2.10　标签页（Tabs）的使用　173

8.2.11　工具提示框（Tooltip）的使用　175

8.3　jQuery UI的特效　177

8.3.1　拖动特效（Draggable）的使用　177

8.3.2　放置特效（Droppable）的使用　178

8.3.3　缩放特效（Resizable）的使用　179

8.3.4　选择特效（Selectable）的使用　180

8.3.5　排序特效（Sortable）的使用　181

8.3.6　显示特效（show）的使用　182

8.3.7　隐藏特效（hide）的使用　184

8.3.8　切换特效（toggle）的使用　186

8.4　综合实例：使用jQuery实现许愿墙　188

知识点提炼　190

习题　191

第9章　常用的第三方jQuery插件　192

9.1　jQuery插件概述　193

9.1.1　什么是jQuery插件　193

9.1.2　常用的第三方jQuery插件　193

9.1.3　如何调用第三方jQuery插件　193

9.2　常用jQuery插件的使用　194

9.2.1　uploadify插件（文件上传）　194

9.2.2　zTree插件（树菜单）　198

9.2.3　Nivo Slider插件（图片切换）　202

9.2.4　Pagination插件（数据分页）　205

9.2.5　jQZoom插件（图片放大镜）　207

9.3　综合实例：使用ColorPicker插件制作颜色选择器　209

知识点提炼　210

习题　210

第　10章 jQuery性能优化与技巧　211

10.1　jQuery性能优化　212

10.2　jQuery常用技巧　216

知识点提炼　221

习题　222

第　11章 jQuery在HTML5中的应用　223

11.1　HTML5基础　224

11.1.1　HTML5的新特性　224

11.1.2　浏览器对HTML5的支持　224

11.2　jQuery与HTML5编程　226

11.2.1　显示文件上传的进度条　226

11.2.2　Canvas绘图　228

11.2.3　jQuery HTML5实现图片旋转效果　230

11.2.4　基于HTML5播放声音的jQuery插件audioPlay　232

11.2.5　Web Storage编程　233

11.3　综合实例：旅游信息网前台页面设计　236

11.3.1　网站预览　236

11.3.2　网站主体结构设计　239

11.3.3　HTML5结构元素的使用　239

11.3.4　网站公共部分设计　240

11.3.5　网站主页设计　244

11.3.6　留下足迹页面设计　246

知识点提炼　248

习题　248

第　12章 综合实战——使用jQuery实现携程网站特效　249

12.1　网站特效　250

12.2　特效需求　250

12.2.1　网站注册表单布局设计　250

12.2.2　倒计时交互设计　250

12.2.3　网站登录布局与交互设计　250

12.2.4　导航菜单设计　251

12.2.5　海报轮播效果设计　251

12.2.6　页签切换效果设计　251

12.2.7　左右滑动效果设计　252

12.2.8　手风琴效果设计　252

12.2.9　图片放大缩小效果制作　253

12.3　关键知识点　253

12.4　模块设计实现　254

12.4.1　网站注册表单布局设计　254

12.4.2　倒计时交互设计　260

12.4.3　网站登录布局与交互设计　262

12.4.4　导航菜单设计　266

12.4.5　海报轮播效果制作　269

12.4.6　页签切换效果设计　272

12.4.7　左右滑动切换效果设计　276

12.4.8　手风琴效果菜单设计　278

12.4.9　图片放大缩小效果制作　281

12.5　本章总结　284