jQuery Cookbook中文版

目　錄

第1章　jQuery基礎(chǔ)　1
1.1　在HTML頁面中包含jQuery程序庫代碼　9
1.2　在DOM加載之后、整個(gè)頁面加載之前執(zhí)行jQuery/JavaScript代碼　10
1.3　用選擇器和jQuery函數(shù)選擇DOM元素　13
1.4　在指定上下文中選擇DOM元素　15
1.5　過濾DOM元素包裝器集　16
1.6　查找當(dāng)前選擇包裝器集中的后代元素　17
1.7　返回破壞性修改之前的選擇　19
1.8　將前一個(gè)選擇集包含到當(dāng)前選擇集　20
1.9　根據(jù)當(dāng)前上下文遍歷DOM獲得新的DOM元素集　21
1.10　創(chuàng)建、操作和插入DOM元素　22
1.11　刪除DOM元素　24
1.12　替換DOM元素　25
1.13　克隆DOM元素　26
1.14　獲取、設(shè)置和刪除DOM元素屬性　29
1.15　獲取和設(shè)置HTML內(nèi)容　30
1.16　獲取和設(shè)置文本內(nèi)容　31
1.17　在不造成全局沖突的情況下使用$別名　32

第2章　用jQuery選擇元素　33
2.1　僅選擇子元素　34
2.2　選擇特定的兄弟元素　35
2.3　按照索引順序選擇元素　37
2.4　選擇當(dāng)前動(dòng)畫元素　39
2.5　根據(jù)包含的內(nèi)容選擇元素　40
2.6　選擇不匹配的元素　41
2.7　根據(jù)可見性選擇元素　42
2.8　根據(jù)屬性選擇元素　43
2.9　按照類型選擇表單元素　44
2.10　選擇有具體特性的元素　45
2.11　使用上下文參數(shù)　47
2.12　創(chuàng)建一個(gè)子定義過濾器選擇器　48

第3章　超越基礎(chǔ)　51
3.1　循環(huán)讀取選擇結(jié)果集合　51
3.2　將選擇集縮減為某個(gè)特定項(xiàng)　54
3.3　將選中的jQuery對(duì)象轉(zhuǎn)換為原始DOM對(duì)象　57
3.4　獲得選擇集中某個(gè)元素的索引　59
3.5　從現(xiàn)有數(shù)組中建立獨(dú)特的數(shù)組　61
3.6　在選擇集合的子集上執(zhí)行某項(xiàng)操作　63
3.7　配置jQuery，避免與其他程序庫沖突　66
3.8　用插件增加功能　68
3.9　確定使用的到底是哪一個(gè)查詢　71

第4章　jQuery工具　73
4.1　用jQuery.suppoert檢測(cè)功能　73
4.2　用jQuery.each循環(huán)讀取數(shù)組和對(duì)象　75
4.3　用jQuery.grep過濾數(shù)組　76
4.4　用jQuery.map循環(huán)修改數(shù)組元素　77
4.5　用jQuery.merge合并兩個(gè)數(shù)組　78
4.6　用jQuery.unique過濾重復(fù)的數(shù)組元素　78
4.7　用jQuery.isFunction測(cè)試回調(diào)函數(shù)　79
4.8　用jQuery.trim從字符串或者表單值中刪除空格　80
4.9　用jQuery.data將對(duì)象和數(shù)據(jù)附加到DOM中　80
4.10　用jQuery.extend擴(kuò)展對(duì)象　82

第5章　更快、更簡單、更有趣　84
5.1　這不是jQuery，而是JavaScript　84
5.2　$(this)出了什么問題　85
5.3　刪除多余的重復(fù)　88
5.4　格式化jQuery鏈　89
5.5　從其他程序庫借用代碼　91
5.6　編寫自定義迭代器　93
5.7　切換屬性　96
5.8　尋找瓶頸　98
5.9　緩存jQuery對(duì)象　102
5.10　編寫更快的選擇器　104
5.11　更快地加載表格　106
5.12　編寫基本的循環(huán)代碼　109
5.13　減少名稱查找　112
5.14　用.innerHTML更快地更新DOM　114
5.15　分解方法鏈　115
5.16　這是jQuery的缺陷嗎　117
5.17　跟蹤jQuery　118
5.18　減少服務(wù)器請(qǐng)求的數(shù)量　120
5.19　編寫無干擾式的JavaScript　123
5.20　將jQuery用于漸進(jìn)增強(qiáng)　126
5.21　使頁面易于訪問　127

第6章　尺寸　132
6.1　求取窗口和文檔的尺寸　132
6.2　求取元素的尺寸　133
6.3　求取元素的偏移量　135
6.4　滾動(dòng)元素使其可見　138
6.5　確定元素是否在視區(qū)內(nèi)　140
6.6　將元素放在視區(qū)的中央　143
6.7　在當(dāng)前位置絕對(duì)定位一個(gè)元素　144
6.8　按照與另一個(gè)元素的相對(duì)位置定位元素　145
6.9　根據(jù)瀏覽器寬度切換樣式表　146

第7章　特效　149
7.1　滑動(dòng)和淡入/淡出元素　151
7.2　通過向上滑動(dòng)使元素可見　154
7.3　創(chuàng)建水平折疊特效　155
7.4　同時(shí)滑動(dòng)和淡入/淡出元素　159
7.5　應(yīng)用連續(xù)的特效　160
7.6　確定元素目前是否處于動(dòng)畫中　162
7.7　停止和復(fù)位動(dòng)畫　163
7.8　為特效使用自定義的緩動(dòng)方法　164
7.9　禁用所有特效　165
7.10　將jQuery UI用于高級(jí)特效　166

第8章　事件　168
8.1　將一個(gè)事件處理程序用于許多事件　169
8.2　對(duì)不同的數(shù)據(jù)重用處理程序函數(shù)　170
8.3　刪除整組事件處理程序　172
8.4　觸發(fā)特定事件處理程序　173
8.5　向事件處理程序傳遞動(dòng)態(tài)數(shù)據(jù)　174
8.6　盡早訪問元素(在document.ready之前)　176
8.7　停止處理程序執(zhí)行循環(huán)　179
8.8　在使用event.target時(shí)獲取正確的元素　181
8.9　避免多個(gè)hover()動(dòng)畫并行顯示　182
8.10　使事件處理程序適用于新添加的元素　185

第9章　高級(jí)事件　188
9.1　在動(dòng)態(tài)加載時(shí)運(yùn)行jQuery　188
9.2　加速全局事件觸發(fā)　189
9.3　創(chuàng)建自己的事件　192
9.4　讓事件處理程序提供需要的數(shù)據(jù)　195
9.5　創(chuàng)建事件驅(qū)動(dòng)插件　198
9.6　在調(diào)用jQuery方法時(shí)得到通知　202
9.7　將對(duì)象方法作為事件監(jiān)聽器使用　205

第10章　從頭開始增強(qiáng)HTML表單　208
10.1　在頁面加載時(shí)將焦點(diǎn)放在一個(gè)文本輸入字段上　209
10.2　禁用和啟用表單元素　210
10.3　自動(dòng)選擇單選按鈕　213
10.4　用專用的鏈接選擇(反選)所有復(fù)選框　215
10.5　用一個(gè)切換開關(guān)選中(反選)所有復(fù)選框　216
10.6　添加和刪除Select元素中的選項(xiàng)　218
10.7　根據(jù)字符計(jì)數(shù)自動(dòng)跳到下一個(gè)控件　219
10.8　顯示剩余字符串計(jì)數(shù)　221
10.9　限制文本輸入字段內(nèi)容為特定的字符　224
10.10　用Ajax提交表單　225
10.11　驗(yàn)證表單　227

第11章　用插件增強(qiáng)HTML表單　234
11.1　驗(yàn)證表單　235
11.2　創(chuàng)建固定格式的輸入字段　244
11.3　自動(dòng)補(bǔ)全文本字段　246
11.4　選擇一個(gè)取值范圍　247
11.5　輸入范圍約束值　250
11.6　在后臺(tái)上傳文件　253
11.7　限制輸入文本的長度　254
11.8　在輸入字段上方顯示標(biāo)簽　255
11.9　根據(jù)內(nèi)容增大輸入字段　257
11.10　選擇日期　258

第12章　jQuery插件　261
12.1　從哪里尋找jQuery插件　261
12.2　何時(shí)應(yīng)該編寫一個(gè)jQuery插件　263
12.3　編寫第一個(gè)jQuery插件　265
12.4　向插件傳遞選項(xiàng)　266
12.5　在插件中使用$快捷方式　268
12.6　在插件中包含私有函數(shù)　269
12.7　支持元數(shù)據(jù)插件　271
12.8　為插件添加靜態(tài)函數(shù)　272
12.9　用Qunit對(duì)插件進(jìn)行單元測(cè)試　274

第13章　從頭開始創(chuàng)建界面組件　277
13.1　創(chuàng)建自定義工具提示　278
13.2　使用文件樹擴(kuò)展器導(dǎo)航　283
13.3　展開折疊控件　286
13.4　選擇文檔中的不同選項(xiàng)卡　291
13.5　顯示簡單的模態(tài)窗口　294
13.6　構(gòu)建下拉菜單　300
13.7　交叉消隱的循環(huán)圖像　303
13.8　滑動(dòng)面板　308

第14章　使用jQuery UI構(gòu)建用戶界面　312
14.1　包含整個(gè)jQuery UI套件　314
14.2　包含單獨(dú)的一兩個(gè)jQuery UI插件　315
14.3　用默認(rèn)選項(xiàng)初始化jQuery UI插件　316
14.4　用自定義選項(xiàng)初始化jQuery UI插件　317
14.5　創(chuàng)建你自己的jQuery UI插件默認(rèn)值　318
14.6　獲取和設(shè)置jQuery UI插件選項(xiàng)　320
14.7　調(diào)用jQuery UI插件方法　320
14.8　處理jQuery UI插件事件　321
14.9　銷毀jQuery UI插件　324
14.10　創(chuàng)建jQuery音樂播放器　324

第15章　jQuery UI主題　338
15.1　用ThemeRoller設(shè)置jQuery UI窗口組件樣式　342
15.2　覆蓋jQuery UI布局和主題樣式　354
15.3　為非jQuery UI組件應(yīng)用主題　364
15.4　在一個(gè)頁面上引用多個(gè)主題　372
15.5　附錄：其他CSS資源　380

第16章　jQuery、Ajax、數(shù)據(jù)格式：HTML、XML、JSON、JSONP　381
16.1　jQuery和Ajax　381
16.2　在整個(gè)網(wǎng)站上使用Ajax　384
16.3　使用帶有用戶反饋的簡單Ajax　386
16.4　使用Ajax快捷方法和數(shù)據(jù)類型　391
16.5　使用HTML片段和jQuery　393
16.6　將XML轉(zhuǎn)換為DOM　394
16.7　創(chuàng)建JSON　395
16.8　解析JSON　396
16.9　使用jQuery和JSONP　397

第17章　在大項(xiàng)目中使用jQuery　400
17.1　使用客戶端存儲(chǔ)　400
17.2　為單個(gè)會(huì)話保存應(yīng)用程序狀態(tài)　403
17.3　在會(huì)話之間保存應(yīng)用程序狀態(tài)　404
17.4　使用JavaScript模板引擎　406
17.5　Ajax請(qǐng)求隊(duì)列　409
17.6　處理Ajax和后退按鈕　410
17.7　將JavaScript放在頁面的最后　412

第18章　單元測(cè)試　414
18.1　自動(dòng)化單元測(cè)試　414
18.2　斷言結(jié)果　416
18.3　測(cè)試同步回調(diào)　417
18.4　測(cè)試異步回調(diào)　418
18.5　測(cè)試用戶操作　419
18.6　保持測(cè)試的原子性　420
18.7　分組測(cè)試　422
18.8　選擇運(yùn)行的測(cè)試　423

后記　425