jQuery Web开发案例教程 在线实训版

丛书特色： （1）编排丰富实战案例，可扫前言二维码进行快速预览。 （2）提供在线实训平台（http://code.artech.cn），支撑随时开展全书案例实战演练。 （3）开源分阶实战项目（http://www.geekfun.website），助力不同层次读者（学生）获取企业实战项目开发能力。 （4）配套多类教辅资源，包含文本类、视频类（微课视频）、案例类、平台类等。 （5）建立教师服务与交流群（QQ群号：368845661），立体化服务院校教师教学。 特别说明： 为了使本书中的案例作用优选化，我们专门为其提供了“在线实训平台”（http://code.artech.cn）。该平台的具体功能介绍如下。 【在线实训平台】功能： （1）教师可以利用该平台，在上课过程中直接演练（展示）书中的所有案例，并可通过实时的运行结果同步讲解相关知识点和技能。 （2）师生可以通过该平台观看全书导学、原理讲解、案例讲解等视频，配合实操演练，随时随地进行学习，支持开展线上线下混合式教学。 （3）学生可以在课前或课后通过该平台，实操练习书中的所有案例，实时查看代码运行结果，而且所有案例代码均支持复制与还原。 （4）学生还可以通过该平台实操练习各章课后的实操题，并可通过微信分享功能，将实操的结果分享给其他人，如分享给老师进行审阅。 说明：扫描“从书序中的二维码”可以了解该平台的具体使用方法，教师也可通过“教师用书指导手册”了解该平台的具体操作步骤。

随着互联网技术的不断发展，JavaScript语言及相关技术越来越受到人们的关注，JavaScript框架层出不穷。jQuery作为JavaScript框架中的优秀代表，为广大开发者提供了诸多便利，持久地占据着Web前端开发技术中的重要位置。
本书分为上下两篇，通过丰富的实例详细讲解jQuery框架的相关技术。本书上篇会针对jQuery基础知识，以及选择器、控制DOM、事件、AJAX、动画、插件等专题进行深入讲解，这一部分将重点通过应用和案例来讲解实战问题。本书下篇会通过5个综合实例，完整地演示使用jQuery进行综合项目开发的过程，使读者能够真正地将jQuery应用到真实的项目开发环节中，并对Web前端的工程化有所认知。本书内容翔实、结构框架清晰、讲解循序渐进，并注重各章以及实例之间的呼应与对照。
本书既可以作为高等院校相关专业网页设计与制作、前端开发等课程的教材，也可以作为jQuery初学者的入门用书，还可以作为高级用户进一步学习相关技术的参考资料。

温谦： ## 全栈工程师，前沿科技创始人，现从事企业大型软件系统的分析与开发工作，拥有超20年的软件开发经验，主持并成功开发了多个复杂系统，项目实战经验丰富。 ## 常销书作者，毕业于华中科技大学计算机专业，主编网页设计与软件开发相关领域图书共12本，图书编写经验颇丰，其中《HTML+CSS网页设计与布局从入门到精通》《网页设计与布局项目化教程（HTML+CSS+DIV）》等图书常销10余年，被百余所高校选作教材。

【上篇】jQurey基础篇
第1章jQuery基础
1．1jQuery概述2
1．1．1jQuery简介2
1．1．2下载并使用jQuery3
1．2jQuery的$4
1．2．1选择器4
1．2．2功能函数的前缀6
1．2．3window．onload6
1．2．4创建DOM元素7
1．2．5扩展jQuery8
1．2．6冲突问题9
1．3使用VSCode编写第一个jQuery页面10
1．3．1创建基础的HTML文档10
1．3．2编写jQuery代码11
本章小结12
习题112
第2章HTML5、CSS3和JavaScript基础知识
2．1ES6的新特性14
2．1．1let关键字15
2．1．2const关键字15
2．1．3for…of循环16
2．1．4字符串模板16
2．1．5参数默认值17
2．1．6类与继承17
2．1．7箭头函数18
2．1．8剩余运算符与剩余参数20
2．1．9展开运算符20
2．1．10数组的解构赋值21
2．1．11对象的解构赋值21
2．1．12模块22
2．2HTML5新增的语义化标记23
2．3CSS3引入的常用新特性24
2．3．1CSS3新增的常用样式属性25
2．3．2新增的布局方式——弹性盒子布局27
2．3．3新增的布局方式——网格布局28
本章小结29
习题229
第3章jQuery选择器与管理结果集
3．1选择器30
3．1．1属性选择器31
3．1．2包含选择器33
3．1．3位置选择器34
3．1．4过滤选择器37
3．1．5反向选择器39
3．2遍历DOM39
3．2．1children()40
3．2．2parent()和parents()42
3．2．3siblings()44
3．3管理结果集45
3．3．1获取选中元素的个数46
3．3．2提取元素47
3．3．3添加、删除、过滤49
3．3．4查找52
3．3．5遍历53
3．4jQuery链54
本章小结54
习题355
第4章使用jQuery控制DOM
4．1网页中的DOM框架57
4．2DOM中的节点57
4．2．1元素节点58
4．2．2文本节点58
4．2．3属性节点58
4．3标记的属性58
4．3．1获取属性的值59
4．3．2设置属性的值60
4．3．3删除属性62
4．4元素的样式62
4．4．1添加、删除CSS类别63
4．4．2动态切换63
4．4．3直接获取、设置样式64
4．5页面的元素66
4．5．1直接获取和编辑内容66
4．5．2添加元素68
4．5．3删除元素72
4．5．4克隆元素74
4．6表单元素的值75
4．6．1获取表单元素的值75
4．6．2设置表单元素的值77
4．7元素的尺寸77
4．7．1width()和height()方法78
4．7．2innerWidth()和innerHeight()方法79
4．7．3outerWidth()和outerHeight()方法80
4．8元素的位置81
4．8．1offset()方法81
4．8．2position()方法82
4．8．3scrollTop()方法83
本章小结84
习题484
第5章jQuery事件
5．1事件与事件流86
5．2事件监听87
5．2．1bind()方法87
5．2．2one()方法89
5．2．3JavaScript的事件监听90
5．3事件删除92
5．4事件对象93
5．5事件触发95
5．6事件的动态交替96
5．6．1hover事件的交替96
5．6．2click事件的交替97
5．7事件委托98
5．8综合实例：快餐在线100
5．8．1框架搭建100
5．8．2添加事件101
5．8．3样式104
本章小结106
习题5107
第6章jQuery的功能函数
6．1处理JavaScript对象108
6．1．1遍历108
6．1．2数据过滤110
6．1．3数组的转化112
6．1．4数组元素的查找114
6．2获取外部代码115
6．3$．data()方法116
6．4$．extend()方法118
6．5类型判断119
本章小结120
习题6121
第7章jQuery与AJAX
7．1认识AJAX122
7．1．1AJAX的基本概念122
7．1．2AJAX的组成124
7．2获取异步数据124
7．2．1传统方法124
7．2．2jQuery的load()方法126
7．3GET与POST128
7．4控制AJAX130
7．4．1设置AJAX访问服务器的细节130
7．4．2全局设定AJAX133
7．4．3AJAX事件133
7．4．4实例：模拟百度的数据加载135
7．5实例：利用jQuery制作自动提示的文本框137
7．5．1框架结构138
7．5．2匹配用户输入139
7．5．3显示清除提示框139
本章小结143
习题7143
第8章利用jQuery制作动画与特效
8．1元素的显示和隐藏145
8．1．1show()和hide()145
8．1．2实例：多级菜单146
8．1．3toggle()148
8．2淡入淡出的特效149
8．2．1再探讨show()、hide()和toggle()149
8．2．2fadeIn()和fadeOut()150
8．2．3自定义变化透明度151
8．3幻灯片特效153
8．4自定义动画155
本章小结156
习题8156
第9章jQuery插件
9．1模拟加入购物车158
9．1．1鼠标拖曳158
9．1．2拖入购物车162
9．1．3模态框提示163
9．2流行的Tab菜单167
9．3轮播图170
9．3．1使用轮播图插件前的准备170
9．3．2使用轮播图插件171
9．3．3调整轮播图效果172
本章小结174
习题9174
【下篇】jQuery综合实例篇
第10章综合实例一：网页留言本
10．1基本留言本177
10．2改用AJAX方式实现留言本179
10．2．1读取留言列表180
10．2．2保存并返回新留言180
10．2．3制作留言本入口页面180
10．3对表单数据进行验证182
本章小结184
第11章综合实例二：网络相册
11．1整体分析185
11．2模块拆分186
11．2．1缩略图排列186
11．2．2缩略图提示189
11．2．3显示大图189
11．3功能细化191
11．3．1初始化页面191
11．3．2单击缩略图191
11．3．3关闭按钮192
11．3．4大图浏览193
本章小结195
第12章综合实例三：交互式流量套餐选择页面
12．1表格框架197
12．1．1表格197
12．1．2选择套餐198
12．1．3商用页面199
12．2交互选择201
12．3注册单202
12．3．1注册单框架202
12．3．2注册单的显示和隐藏204
12．3．3AJAX校验206
12．3．4密码校验208
12．3．5AJAX提交208
本章小结210
第13章综合实例四：网页图片剪裁器
13．1整体分析212
13．2页面HTML结构和CSS样式213
13．2．1HTML结构213
13．2．2选区部分的结构与样式214
13．3实现核心逻辑215
13．3．1定义基础类215
13．3．2定义Cropper类217
13．4使用jQuery处理交互221
13．4．1初始化图像221
13．4．2控制选区222
13．4．3最终剪裁226
本章小结227
第14章综合实例五：前端工程化
14．1在浏览器中监视与调试228
14．1．1使用console．log()和alert()方法监视输出值228
14．1．2使用调试器230
14．2JavaScript优化232
14．2．1压缩代码量232
14．2．2变量作用域234
14．2．3使用内置函数236
14．2．4优化if语句237
14．2．5最小化语句数量237
14．2．6减少DOM操作238
14．3使用webpack构建系统238
14．3．1安装Node．js环境239
14．3．2准备项目文件240
14．3．3安装webpack及相关组件241
14．3．4预览与调试244
14．3．5打包246
本章小结248