內容簡介
jQuery 是一套輕型Javascript 腳本庫,是目前最熱門的Web 前兵祝蘭端開發技術之一。jQuery 的語法很簡單,它的核心理念是""write less,do more""。與其他語言相比,實現同樣的功能時,使翻斷己用jQuery 需要編寫的代碼更少。
本書包括基礎篇、進階篇和篇,全面介紹了jQuery 編程的基礎知識和實用技術,還介紹了大量套用實例,包括提示條、圖片播放、選單和選少慨項卡、動畫文本和圖示選單、廣告設計等。讀者在閱讀本書時可以充分了解和體驗jQuery 的強大功能。
圖書目錄
第 1部分 基礎篇
第 1章 jQuery概述 2
1.1 初識jQuery 2
1.1.1 什麼是jQuery 2
1.1.2 jQuery的優勢 3
1.1.3 下載jQuery腳本檔案和配置jQuery環境 4
1.1.4 第 一個簡單的jQuery程式 5
1.2.2 jQuery對象 7
1.3 jQuery開發工具 8
1.3.1 使用Dreamweaver編境己捉輯jQuery程式 8
1.3.2 調試jQuery程式 9
練習題 9
第 2章 JavaScript程式設計 11
2.1 在HTML中使用JavaScript語言 11
2.1.1 在HTML中插入JavaScript代碼 11
2.1.2 使用js檔案 12
2.2 基本語法 12
2.2.1 數據類型 12
2.2.2 變數 12
2.2.3 注釋 13
2.2.4 運算符 13
2.3 常用語句 17
2.3.1 條件分支語句 17
2.3.2 循環語句 21
2.4 函式 24
2.4.1 創建自定義函式 24
2.4.2 調用函式 25
2.4.3 變數的作用域 26
2.4.4 函式的返回值 26
2.5 JavaScript內置對象 27
2.5.1 JavaScript的內置類框架 27
2.5.2 BOM對象編程 少盼悼元31
2.6 JavaScript事件處理 35
2.6.1 常用HTML事件 35
2.7 JavaScript編輯和調試工具 38
2.7.1 使用Dreamweaver編輯JavaScript程式 38
2.7.2 調試JavaScript程式 40
練習題 42
第 2部分 進階篇
第3章 jQuery選擇器 46
3.1 基礎選擇器 46
3.1.1 Id選擇器 46
3.1.2 標籤名選擇器 47
3.1.3 根據元素的CSS類選擇 47
3.1.5 同時選擇多個HTML元素 49
3.2 層次選擇器 50
3.2.1 ancestor descendant(祖先 後代)選擇器 50
3.2.2 parent>child(父>子)選擇器 51
3.2.3 prev+next(前+後)選擇器 52
3.2.4 prev~siblings(前~兄弟)選擇器 53
3.3 jQuery過濾器 54
3.3.1 基本過濾器 54
3.3.2 內容過濾器 56
3.3.3 可見性過濾器 58
3.3.4 屬性過濾器 59
3.3.5 子元素過濾器 61
練習題 62
第4章 使用jQuery操作HTML元素 63
4.1 使用jQuery訪問HTML元素的屬性和內容 63
4.1.2 使用jQuery獲取和設定HTML元素的內容 65
4.1.3 使套拳連蒸用jQuery獲取和設定HTML元素的屬性 66
4.1.4 使用jQuery刪除HTML元素的屬性 68
4.1.5 使用jQuery在網頁中添加追加內容 68
4.2 使用jQuery管理HTML元素 70
4.2.1 使用jQuery遍歷HTML元素 70
4.2.2 使用jQuery檢查某個元素是否包含指定元素 71
4.2.3 使用jQuery刪戀戶淋除HTML元素 72
4.2.4 使用jQuery插入HTML元素 74
4.2.5 使用jQuery複製HTML元素 75
4.2.6 使用jQuery替換HTML元素 75
練習題 76
第5章 jQuery外掛程式 78
5.1 概述 78
5.1.1 jQuery的外掛程式機制 78
5.1.2 使用jQuery外掛程式 80
5.2 滾動外掛程式 83
5.2.1 捕獲滾動事件的外掛程式Waypoints 83
5.2.2 滾動特效外掛程式scrollTo 84
5.3 圖表外掛程式 85
5.3.1 Excel樣式的表格外掛程式Handsontable 85
5.3.2 HTML表格外掛程式DataTables 89
5.3.3 圖表效果外掛程式Sparklines 91
5.4 布局外掛程式 93
5.4.1 布局外掛程式Masonry 93
5.4.2 動態布局外掛程式Freetile.js 95
5.4.3 瀑布流的網頁布局外掛程式Wookmark 98
5.5 文字處理外掛程式 100
5.5.1 自動調整文本大小的FitText.js外掛程式 100
5.5.2 就地編輯外掛程式jeditable 101
5.6 UI外掛程式 103
5.6.1 旋鈕外掛程式knob 103
5.6.2 顯示模式彈出框的外掛程式Avgrund 104
5.6.3 滑動導航外掛程式SlideDeck 106
練習題 107
第6章 jQuery的表單編程 109
6.1.1 定義表單 109
6.1.2 文本框 110
6.1.3 文本區域 111
6.1.4 單選按鈕 111
6.1.5 複選框 112
6.1.6 組合框 113
6.1.7 按鈕 113
6.2 jQuery的表單選擇器和過濾器 115
6.2.1 表單選擇器 115
6.2.2 表單過濾器 116
6.3 jQuery的表單事件處理 118
6.3.1 blur()方法和focus()方法 118
6.3.2 change()方法 119
6.3.3 select()方法 120
6.3.4 submit()方法 121
6.4 操作表單元素 122
6.4.1 操作文本框和文本域 122
6.4.2 操作單選按鈕和複選框 122
6.4.3 操作下拉框 123
6.5 jQuery的表單外掛程式 123
6.5.1 a-tools外掛程式 123
6.5.2 兩級級聯下拉列表外掛程式DoubleSelection 126
6.5.3 表單驗證外掛程式Validate 127
6.5.4 其他值得推薦的表單外掛程式 129
練習題 129
第7章 jQuery事件處理 131
7.1 事件處理函式 131
7.1.1 指定事件處理函式 131
7.1.2 綁定到事件處理函式 131
7.1.3 移除事件綁定 133
7.2.1 Event對象的屬性 135
7.2.2 Event對象的方法 136
7.3 jQuery事件方法 137
7.3.1 鍵盤事件 137
7.3.2 滑鼠事件 138
7.3.3 文檔載入事件 139
7.3.4 瀏覽器事件 139
練習題 141
8.1 CSS基礎 142
8.1.1 什麼是CSS 142
8.1.2 在HTML文檔中套用CSS 143
8.1.3 顏色與背景 145
8.1.4 設定字型 146
8.1.5 設定文本對齊 147
8.1.6 超連結 148
8.1.7 列表 149
8.1.8 框線 151
8.1.10 浮動元素 154
8.2 CSS3的新技術 155
8.2.1 實現圓角效果 155
8.2.2 多彩的框線顏色 159
8.2.3 陰影 161
8.2.4 背景圖片 161
8.2.5 多列 163
8.2.6 嵌入字型 164
8.2.7 透明度 166
8.2.8 HSL和HSLA顏色表現方法 167
8.3.1 使用css()方法獲取和設定CSS屬性 169
8.3.2 與樣式類別有關的方法 170
8.3.3 獲取和設定HTML元素的尺寸 171
8.3.4 獲取和設定元素的位置 173
8.3.5 滾動條相關 174
8.4 套用實例 175
8.4.1 動態控制頁面字型大小 175
8.4.2 快捷切換網頁顯示樣式 176
練習題 178
第3部分 套用篇
第9章 jQuery動畫特效 182
9.1 顯示和隱藏HTML元素 182
9.1.1 以動畫效果顯示HTML元素 182
9.1.2 隱藏HTML元素 183
9.1.3 切換HTML元素的顯示和隱藏狀態 184
9.2 淡入/淡出效果 184
9.2.1 實現淡入效果 184
9.2.2 實現淡出效果 185
9.2.3 直接調節HTML元素的透明度 186
9.2.4 以淡入/淡出的效果切換顯示和隱藏HTML元素 187
9.3 滑動效果 187
9.3.1 以滑動效果顯示隱藏的HTML元素 188
9.3.2 以滑動效果隱藏HTML元素 188
9.3.3 以滑動效果切換顯示和隱藏HTML元素 189
9.4 動畫佇列 190
9.4.1 queue()方法 190
9.4.2 dequeue()方法 192
9.4.3 刪除動畫佇列中的成員 192
9.4.4 延遲動畫 193
9.4.5 停止正在執行的動畫 194
9.5 執行自定義的動畫 194
9.6 套用實例:焦點視頻切換欄 196
9.6.1 實例界面和結構 196
9.6.2 設計實例頁面 197
9.6.3 實現滑動切換的jQuery腳本 201
練習題 203
第 10章 jQuery與Ajax 204
10.1.1 創建XMLHttpRequest對象 204
10.1.3 從伺服器接收數據 205
10.2 在jQuery中實現Ajax編程 208
10.2.1 load()方法 208
10.2.2 $.get()方法 209
10.2.3 $.post()方法 209
10.2.4 $.getJSON()方法 210
10.2.5 $.ajax()方法 211
10.2.6 利用Ajax提交表單 212
10.2.7 Ajax的事件 214
10.3 套用實例——使用Ajax實現登錄頁面 218
練習題 220
第 11章 jQuery與HTML5 222
11.1 HTML5基礎 222
11.1.1 什麼是HTML 222
11.1.2 HTML5的新特性 223
11.1.3 瀏覽器對HTML5的支持 226
11.2 jQuery HTML5實用編程 227
11.2.1 支持進度顯示的檔案上傳 227
11.2.2 jQuery+HTMl5 localStorage編程 232
11.2.3 Canvas繪圖 235
11.2.4 基於HTML5播放聲音的jQuery外掛程式audioPlay 241
11.3 套用實例 243
11.3.1 jQuery+HTML5+CSS3設計頁面布局的實例 243
11.3.2 jQuery+HTML5+CSS3設計視頻播放器的實例 248
練習題 253
12.1 提示條實例 255
12.1.1 滑出式提示條 255
12.1.2 智慧型提示條 260
12.2 圖片播放 263
12.2.1 實現幻燈片特效 263
12.2.2 實現魔幻盒特效 265
12.2.3 滾動展示圖片 268
12.2.4 圖片的翻轉 269
12.2.5 幻燈片式畫廊 270
12.2.6 Blockster過渡特效 277
12.2.7 自動滑動播放圖片 279
12.3 選單和選項卡 280
12.3.1 jQuery+CSS設計選項卡和側邊欄選單 280
12.3.2 動畫選單 283
12.3.3 動畫文本和圖示選單 285
12.3.4 懸停切換的欄目 287
12.3.5 懸停下拉選單 289
12.3.6 動態導航選單 291
12.4 廣告特效 294
12.4.1 自定義動畫廣告條 294
12.4.2 彈性伸縮廣告 297
第 13章 jQuery Mobile 299
13.1 jQuery Mobile概述 299
13.1.1 初識jQuery Mobile 299
13.1.2 引用jQuery Mobile開發包 302
13.2 jQuery Mobile組件 304
13.2.1 頁面設計 304
13.2.2 對話框設計 307
13.2.3 彈出框 309
13.2.4 工具列設計 314
13.2.5 按鈕設計 318
13.2.6 列表設計 321
練習題 323
附錄1 實驗 324
實驗1 初識jQuery 324
實驗2 JavaScript編程 325
實驗3 jQuery選擇器 327
實驗4 操作HTML元素 328
實驗5 jQuery外掛程式 330
實驗6 表單編程 331
實驗7 事件處理 333
實驗8 設定CSS樣式 334
實驗9 jQuery動畫特效 335
實驗10 jQuery與Ajax 336
實驗11 jQuery與HTML5 337
實驗13 jQuery Mobile 341
附錄2 jQuery常用工具函式 343
3.1.3 根據元素的CSS類選擇 47
3.1.5 同時選擇多個HTML元素 49
3.2 層次選擇器 50
3.2.1 ancestor descendant(祖先 後代)選擇器 50
3.2.2 parent>child(父>子)選擇器 51
3.2.3 prev+next(前+後)選擇器 52
3.2.4 prev~siblings(前~兄弟)選擇器 53
3.3 jQuery過濾器 54
3.3.1 基本過濾器 54
3.3.2 內容過濾器 56
3.3.3 可見性過濾器 58
3.3.4 屬性過濾器 59
3.3.5 子元素過濾器 61
練習題 62
第4章 使用jQuery操作HTML元素 63
4.1 使用jQuery訪問HTML元素的屬性和內容 63
4.1.2 使用jQuery獲取和設定HTML元素的內容 65
4.1.3 使用jQuery獲取和設定HTML元素的屬性 66
4.1.4 使用jQuery刪除HTML元素的屬性 68
4.1.5 使用jQuery在網頁中添加追加內容 68
4.2 使用jQuery管理HTML元素 70
4.2.1 使用jQuery遍歷HTML元素 70
4.2.2 使用jQuery檢查某個元素是否包含指定元素 71
4.2.3 使用jQuery刪除HTML元素 72
4.2.4 使用jQuery插入HTML元素 74
4.2.5 使用jQuery複製HTML元素 75
4.2.6 使用jQuery替換HTML元素 75
練習題 76
第5章 jQuery外掛程式 78
5.1 概述 78
5.1.1 jQuery的外掛程式機制 78
5.1.2 使用jQuery外掛程式 80
5.2 滾動外掛程式 83
5.2.1 捕獲滾動事件的外掛程式Waypoints 83
5.2.2 滾動特效外掛程式scrollTo 84
5.3 圖表外掛程式 85
5.3.1 Excel樣式的表格外掛程式Handsontable 85
5.3.2 HTML表格外掛程式DataTables 89
5.3.3 圖表效果外掛程式Sparklines 91
5.4 布局外掛程式 93
5.4.1 布局外掛程式Masonry 93
5.4.2 動態布局外掛程式Freetile.js 95
5.4.3 瀑布流的網頁布局外掛程式Wookmark 98
5.5 文字處理外掛程式 100
5.5.1 自動調整文本大小的FitText.js外掛程式 100
5.5.2 就地編輯外掛程式jeditable 101
5.6 UI外掛程式 103
5.6.1 旋鈕外掛程式knob 103
5.6.2 顯示模式彈出框的外掛程式Avgrund 104
5.6.3 滑動導航外掛程式SlideDeck 106
練習題 107
第6章 jQuery的表單編程 109
6.1.1 定義表單 109
6.1.2 文本框 110
6.1.3 文本區域 111
6.1.4 單選按鈕 111
6.1.5 複選框 112
6.1.6 組合框 113
6.1.7 按鈕 113
6.2 jQuery的表單選擇器和過濾器 115
6.2.1 表單選擇器 115
6.2.2 表單過濾器 116
6.3 jQuery的表單事件處理 118
6.3.1 blur()方法和focus()方法 118
6.3.2 change()方法 119
6.3.3 select()方法 120
6.3.4 submit()方法 121
6.4 操作表單元素 122
6.4.1 操作文本框和文本域 122
6.4.2 操作單選按鈕和複選框 122
6.4.3 操作下拉框 123
6.5 jQuery的表單外掛程式 123
6.5.1 a-tools外掛程式 123
6.5.2 兩級級聯下拉列表外掛程式DoubleSelection 126
6.5.3 表單驗證外掛程式Validate 127
6.5.4 其他值得推薦的表單外掛程式 129
練習題 129
第7章 jQuery事件處理 131
7.1 事件處理函式 131
7.1.1 指定事件處理函式 131
7.1.2 綁定到事件處理函式 131
7.1.3 移除事件綁定 133
7.2.1 Event對象的屬性 135
7.2.2 Event對象的方法 136
7.3 jQuery事件方法 137
7.3.1 鍵盤事件 137
7.3.2 滑鼠事件 138
7.3.3 文檔載入事件 139
7.3.4 瀏覽器事件 139
練習題 141
8.1 CSS基礎 142
8.1.1 什麼是CSS 142
8.1.2 在HTML文檔中套用CSS 143
8.1.3 顏色與背景 145
8.1.4 設定字型 146
8.1.5 設定文本對齊 147
8.1.6 超連結 148
8.1.7 列表 149
8.1.8 框線 151
8.1.10 浮動元素 154
8.2 CSS3的新技術 155
8.2.1 實現圓角效果 155
8.2.2 多彩的框線顏色 159
8.2.3 陰影 161
8.2.4 背景圖片 161
8.2.5 多列 163
8.2.6 嵌入字型 164
8.2.7 透明度 166
8.2.8 HSL和HSLA顏色表現方法 167
8.3.1 使用css()方法獲取和設定CSS屬性 169
8.3.2 與樣式類別有關的方法 170
8.3.3 獲取和設定HTML元素的尺寸 171
8.3.4 獲取和設定元素的位置 173
8.3.5 滾動條相關 174
8.4 套用實例 175
8.4.1 動態控制頁面字型大小 175
8.4.2 快捷切換網頁顯示樣式 176
練習題 178
第3部分 套用篇
第9章 jQuery動畫特效 182
9.1 顯示和隱藏HTML元素 182
9.1.1 以動畫效果顯示HTML元素 182
9.1.2 隱藏HTML元素 183
9.1.3 切換HTML元素的顯示和隱藏狀態 184
9.2 淡入/淡出效果 184
9.2.1 實現淡入效果 184
9.2.2 實現淡出效果 185
9.2.3 直接調節HTML元素的透明度 186
9.2.4 以淡入/淡出的效果切換顯示和隱藏HTML元素 187
9.3 滑動效果 187
9.3.1 以滑動效果顯示隱藏的HTML元素 188
9.3.2 以滑動效果隱藏HTML元素 188
9.3.3 以滑動效果切換顯示和隱藏HTML元素 189
9.4 動畫佇列 190
9.4.1 queue()方法 190
9.4.2 dequeue()方法 192
9.4.3 刪除動畫佇列中的成員 192
9.4.4 延遲動畫 193
9.4.5 停止正在執行的動畫 194
9.5 執行自定義的動畫 194
9.6 套用實例:焦點視頻切換欄 196
9.6.1 實例界面和結構 196
9.6.2 設計實例頁面 197
9.6.3 實現滑動切換的jQuery腳本 201
練習題 203
第 10章 jQuery與Ajax 204
10.1.1 創建XMLHttpRequest對象 204
10.1.3 從伺服器接收數據 205
10.2 在jQuery中實現Ajax編程 208
10.2.1 load()方法 208
10.2.2 $.get()方法 209
10.2.3 $.post()方法 209
10.2.4 $.getJSON()方法 210
10.2.5 $.ajax()方法 211
10.2.6 利用Ajax提交表單 212
10.2.7 Ajax的事件 214
10.3 套用實例——使用Ajax實現登錄頁面 218
練習題 220
第 11章 jQuery與HTML5 222
11.1 HTML5基礎 222
11.1.1 什麼是HTML 222
11.1.2 HTML5的新特性 223
11.1.3 瀏覽器對HTML5的支持 226
11.2 jQuery HTML5實用編程 227
11.2.1 支持進度顯示的檔案上傳 227
11.2.2 jQuery+HTMl5 localStorage編程 232
11.2.3 Canvas繪圖 235
11.2.4 基於HTML5播放聲音的jQuery外掛程式audioPlay 241
11.3 套用實例 243
11.3.1 jQuery+HTML5+CSS3設計頁面布局的實例 243
11.3.2 jQuery+HTML5+CSS3設計視頻播放器的實例 248
練習題 253
12.1 提示條實例 255
12.1.1 滑出式提示條 255
12.1.2 智慧型提示條 260
12.2 圖片播放 263
12.2.1 實現幻燈片特效 263
12.2.2 實現魔幻盒特效 265
12.2.3 滾動展示圖片 268
12.2.4 圖片的翻轉 269
12.2.5 幻燈片式畫廊 270
12.2.6 Blockster過渡特效 277
12.2.7 自動滑動播放圖片 279
12.3 選單和選項卡 280
12.3.1 jQuery+CSS設計選項卡和側邊欄選單 280
12.3.2 動畫選單 283
12.3.3 動畫文本和圖示選單 285
12.3.4 懸停切換的欄目 287
12.3.5 懸停下拉選單 289
12.3.6 動態導航選單 291
12.4 廣告特效 294
12.4.1 自定義動畫廣告條 294
12.4.2 彈性伸縮廣告 297
第 13章 jQuery Mobile 299
13.1 jQuery Mobile概述 299
13.1.1 初識jQuery Mobile 299
13.1.2 引用jQuery Mobile開發包 302