JQuery动态网页设计与制作

《JQuery动态网页设计与制作》是针对零基础读者研发的网站前端开发入门教材。本书侧重案例实训，并配有丰富的微课，读者可以扫描二维码观看。 《JQuery动态网页设计与制作》共分为15章，包括jQuery快速入门、jQuery的选择器、使用jQuery控制页面、jQuery操作事件、jQuery操作动画、jQuery的功能函数、jQuery插件的应用与开发、jQuery与Ajax技术的应用、jQuery的经典交互特效案例、设计响应式网页、流行的响应式开发框架Bootstrap等内容，后通过4个热点综合项目，进一步巩固读者的项目开发经验。 通过书中提供的精选热点案例，可以让初学者快速掌握网站前端开发技术。通过微信扫码看视频，可以随时在移动端学习对应的开发技能。本书还提供技术支持，专为读者答疑解难，可降低零基础学习网站前端开发技术的门槛。

主要负责网页设计、网站开发和Android开发课程，擅长HTML5、CSS3、JavaScript、jQuery技术，一直负责毕业班的实训工作，在移动终端软件开发方面有多年的开发经验，具有很强的实战经验。

第1章  jQuery快速入门 1

1.1  认识jQuery 2

1.1.1  jQuery能做什么 2

1.1.2  jQuery的特点 2

1.2  下载并安装jQuery 3

1.2.1  下载jQuery 3

1.2.2  安装jQuery 4

1.3  测试jQuery 4

1.4  jQuery与CSS 5

1.4.1  CSS 构造规则 5

1.4.2  jQuery的引入 6

1.5  通过案例理解jQuery的技术优势 7

1.6  上机练习 9

第2章  jQuery的选择器 11

2.1  jQuery中美元符号$的使用 12

2.1.1  $符号的使用 12

2.1.2  功能函数的前缀 13

2.1.3  创建DOM元素 14

2.2  基本选择器 14

2.2.1  通配符选择器(*) 15

2.2.2  ID选择器(#id) 16

2.2.3  类名选择器(.class) 17

2.2.4  元素选择器(element) 18

2.2.5  复合选择器 19

2.3  层级选择器 20

2.3.1  祖先后代选择器(ancestor descendant) 20

2.3.2  父子选择器(parent>child) 22

2.3.3  相邻元素选择器(prev next) 23

2.3.4  兄弟元素选择器(prev~siblings) 25

2.4  过滤选择器 26

2.4.1  简单过滤选择器 26

2.4.2  内容过滤选择器 32

2.4.3  可见性过滤器 38

2.4.4  表单过滤器 41

2.5  表单选择器 43

2.5.1  :input 43

2.5.2  :text 44

2.5.3  :password 45

2.5.4  :radio 46

2.5.5  :checkbox 47

2.5.6  :submit 48

2.5.7  :reset 49

2.5.8  :button 50

2.5.9  :image 50

2.5.10  :file 51

2.6  属性选择器 52

2.6.1  [attribute] 52

2.6.2  [attribute=value] 53

2.6.3  [attribute!=value] 55

2.6.4  [attribute$=value] 56

2.7  上机练习 58

第3章  使用jQuery控制页面 59

3.1  对页面的内容进行操作 60

3.1.1  对文本内容进行操作 60

3.1.2  对HTML内容进行操作 61

3.2  对标记的属性进行操作 63

3.2.1  获取属性的值 63

3.2.2  设置属性的值 64

3.2.3  删除属性的值 65

3.3  对表单元素进行操作 66

3.3.1  获取表单元素的值 66

3.3.2  设置表单元素的值 67

3.4  对元素的CSS样式进行操作 68

3.4.1  添加CSS类 68

3.4.2  删除CSS类 70

3.4.3  动态切换CSS类 71

3.4.4  获取和设置CSS样式 72

3.5  获取与编辑DOM节点 74

3.5.1  插入节点 74

3.5.2  删除节点 76

3.5.3  复制节点 78

3.5.4  替换节点 79

3.6  上机练习 80

第4章  使用jQuery操作事件 83

4.1  jQuery的事件机制 84

4.1.1  什么是jQuery的事件机制 84

4.1.2  切换事件 84

4.1.3  事件冒泡 85

4.2  页面加载响应事件 86

4.3  jQuery中的事件函数 87

4.3.1  键盘操作事件函数 87

4.3.2  鼠标操作事件 89

4.3.3  其他的常用事件 92

4.4  事件的基本操作 94

4.4.1  绑定事件 94

4.4.2  触发事件 95

4.4.3  移除事件 96

4.5  上机练习 97

第5章  使用jQuery操作动画 99

5.1  网页动画特效的实现方法 100

5.1.1  通过CSS实现动画特效 100

5.1.2  通过jQuery实现动画特效 101

5.2  jQuery的基本动画效果 103

5.2.1  隐藏元素 103

5.2.2  显示元素 106

5.2.3  状态切换 108

5.3  淡入淡出的动画效果 109

5.3.1  淡入隐藏元素 109

5.3.2  淡出可见元素 111

5.3.3  切换淡入淡出元素 112

5.3.4  淡入淡出元素至指定数值 113

5.4  滑动效果 114

5.4.1  滑动显示匹配的元素 114

5.4.2  滑动隐藏匹配的元素 116

5.4.3  通过高度的变化动态切换元素的可见性 117

5.5  自定义的动画效果 119

5.5.1  创建自定义动画 119

5.5.2  停止动画 120

5.6  上机练习 121

第6章  jQuery的功能函数 123

6.1  功能函数概述 124

6.2  常用的功能函数 124

6.2.1  操作数组和对象 125

6.2.2  操作字符串 128

6.2.3  序列化操作 130

6.3  上机练习 131

第7章  jQuery插件的应用与开发 133

7.1  理解插件 134

7.1.1  什么是插件 134

7.1.2  从哪里获取插件 134

7.1.3  如何使用插件 134

7.2  流行的jQuery插件 135

7.2.1  jQueryUI插件 135

7.2.2  Form插件 139

7.2.3  提示信息插件 140

7.2.4  jcarousel插件 141

7.3  自定义插件 141

7.3.1  插件的工作原理 141

7.3.2  自定义一个简单的插件 142

7.4  上机练习 144

第8章  jQuery与Ajax技术的应用 147

8.1  Ajax概述 148

8.1.1  什么是Ajax 148

8.1.2  Ajax的工作原理 149

8.1.3  Ajax的优缺点 150

8.2  Ajax技术的组成 150

8.2.1  XMLHttpRequest对象 150

8.2.2  XML语言 150

8.2.3  JavaScript语言 152

8.2.4  CSS技术 152

8.2.5  DOM技术 152

8.3  XMLHttpRequest对象 153

8.3.1  初始化XMLHttpRequest对象 153

8.3.2  XMLHttpRequest对象的属性 153

8.3.3  XMLHttpRequest对象的方法 155

8.4  Ajax异步交互的应用 157

8.4.1  什么是异步交互 157

8.4.2  异步对象连接服务器 157

8.4.3  GET和POST模式 159

8.4.4  服务器返回XML文档 161

8.4.5  处理多个异步请求 164

8.5  jQuery中的Ajax 166

8.5.1  load()方法 166

8.5.2  $.get()方法和$.post()方法 169

8.5.3  $.getScript()方法和$.getJson()方法 171

8.5.4  $.ajax()方法 173

8.6  上机练习 174

第9章  jQuery的经典交互特效案例 177

9.1  设计时间轴特效 178

9.2  设计tab页面切换效果 181

9.3  设计滑动门特效 183

9.4  设计焦点图轮播特效 185

9.5  设计网页定位导航特效 189

9.6  设计导航条菜单效果 191

9.7  设计瀑布流特效 194

9.8  设计弹出层效果 196

9.9  设计倒计时效果 198

9.10  设计抽奖效果 200

9.11  上机练习 203

第10章  设计响应式网页 205

10.1  什么是响应式网页设计 206

10.2  像素和屏幕分辨率 207

10.3  视口 207

10.3.1  视口的分类和常用属性 207

10.3.2  媒体查询 208

10.4  响应式网页的布局设计 209

10.4.1  常用布局类型 209

10.4.2  布局的实现方式 210

10.4.3  响应式布局的设计与实现 211

10.5  响应式图片 212

10.5.1  使用标签 212

10.5.2  使用CSS图片 213

10.6  响应式视频 215

10.7  响应式导航菜单 216

10.8  响应式表格 218

10.8.1  隐藏表格中的列 218

10.8.2  滚动表格中的列 221

10.8.3  转换表格中的列 223

10.9  上机练习 226

第11章  流行的响应式开发框架 Bootstrap 227

11.1  Bootstrap概述 228

11.1.1  Bootstrap的特色 228

11.1.2  Bootstrap 4的重大更新 229

11.2  下载Bootstrap 229

11.3  安装和使用Bootstrap 231

11.3.1  本地安装Bootstrap 231

11.3.2  初次使用Bootstrap 232

11.4  使用常用组件 233

11.4.1  使用下拉菜单 233

11.4.2  使用按钮组 234

11.4.3  使用导航组件 235

11.4.4  绑定导航和下拉菜单 237

11.4.5  使用面包屑导航 239

11.4.6  使用广告屏 240

11.4.7  使用card(卡片) 241

11.4.8  使用进度条 243

11.4.9  使用模态框 248

11.4.10  使用滚动监听 250

11.5  胶囊导航选项卡(Tab栏) 252

11.6  上机练习 253

第12章  综合项目1——开发商品信息展示系统 255

12.1  项目需求分析 256

12.2  项目技术分析 258

12.3  系统的代码实现 258

12.3.1  设计首页 258

12.3.2  开发控制器类的文件 260

12.3.3  开发数据模型类文件 261

12.3.4  开发视图抽象类的文件 263

12.3.5  项目中的其他js文件 说明 266

第13章  综合项目2——开发企业门户网站 267

13.1  系统分析 268

13.2  系统设计 268

13.2.1  系统目标 268

13.2.2  系统功能结构 268

13.2.3  文件夹组织结构 268

13.3  网页预览 269

13.3.1  网站首页 269

13.3.2  产品分类页面 270

13.3.3  产品介绍页面 271

13.3.4  新闻中心页面 271

13.3.5  新闻详情页面 272

13.4  项目代码实现 273

13.4.1  网站首页页面代码 273

13.4.2  图片动态效果代码 279

13.4.3  公司简介页面代码 280

13.4.4  产品介绍页面代码 281

13.4.5  新闻中心页面代码 286

13.4.6  联系我们页面代码 288

13.5  项目总结 289

第14章  综合项目3——开发连锁咖啡响应式网站 291

14.1  网站概述 292

14.1.1  网站结构 292

14.1.2  设计效果 292

14.1.3  设计准备 293

14.2  设计首页布局 294

14.3  设计可切换导航 295

14.4  主体内容 300

14.4.1  设计轮播广告区 301

14.4.2  设计产品推荐区 303

14.4.3  设计登录注册按钮 和Logo 303

14.4.4  设计特色展示区 305

14.4.5  设计产品生产流程区 307

14.5  设计底部隐藏导航 309

第15章  综合项目4——开发网上商城网站 311

15.1  系统分析 312

15.2  系统设计 312

15.2.1  系统功能结构 312

15.2.2  文件夹组织结构 312

15.3  网页预览 313

15.3.1  网站首页效果 313

15.3.2  关于我们效果 314

15.3.3  商品展示效果 315

15.3.4  商品详情效果 317

15.3.5  购物车效果 317

15.3.6  品牌故事效果 318

15.3.7  用户登录效果 318

15.3.8  用户注册效果 318

15.4  项目代码实现 319

15.4.1  首页页面代码 319

15.4.2  动态效果代码 331

15.4.3  购物车代码 332

15.4.4  登录页面代码 334

15.4.5  商品展示页面代码 335

15.4.6  “联系我们”页面代码 340

15.5  项目总结 341