從0到1 jQuery快速上手

莫振傑

畢業於暨南大學信科院計算機科學與技術專業，
從事前後端開發4年多，開發過綠葉學習網、
廣州智能工程研究會網站、大量在線應用工具及其他各種類型網站，
著有多本編程書且銷量過萬，現為綠葉學習網的站長，
該網站用於分享其在前後端開發中的一些經驗，
其製作的前後端開發在線教程在互聯網引起廣泛關注，
每一個教程都廣受網友稱讚與推崇，今年還開發了系列前端線上付費課程。  

目錄：  
第1章jQuery… ………………………1  
1.1 jQuery簡介………………………………… 1  
1.1.1從“JavaScript”到“JavaScript庫”… 1  
1.1.2關於jQuery……………………………… 2  
1.2教程介紹… ………………………………… 3  
1.3 jQuery下載與安裝… …………………… 3  
1.3.1下載jQuery……………………………… 3  
1.3.2安裝jQuery……………………………… 4  
1.4本章練習… ……………………… ………… 4  

第2章基礎選擇器… ……………… 5  
2.1 jQuery選擇器簡介… …………………… 5  
2.2基本選擇器… …………………………… … 6  
2.2.1元素選擇器… …………………………… 6  
2.2.2 id選擇器………………………………… 7  
2.2.3 class選擇器… …… …………………… 8  
2.2.4群組選擇器… …………………………… 9  
2.3層次選擇器… ……………………………… 11  
2.3.1後代選擇器… …………………………… 11  
2.3.2子代選擇器… …………………………… 12  
2.3.3兄弟選擇器… ………………… ……… … 14  
2.3.4相鄰選擇器… …………………………… 15  
2.4屬性選擇器… ……………………………… 17  
2.5本章練習… ……………… ………………… 19  

第3章偽類選擇器… ……………… 21  
3.1偽類選擇器簡介… ………………………… 21  
3.2 “位置”偽類選擇器… …………………… 21  
3.3 “子元素”偽類選擇器… ………………… 25  
3.3.1 :first-child、:last-child、:nth-…child(n)、:only-child………25  
3.3 .2 :first-of-type、:last-of-type、:nthof-  
type(n)、:only-of-type… ……… 28  
3.4 “可見性”偽類選擇器… …………… …… 29  
3.5 “內容”偽類選擇器… …………………… 31  
3.6 “表單”偽類選擇器… …………………… 35  
3.7 “表單屬性”偽類選擇器… … …………… 37  
3.8其他偽類選擇器… ………………………… 38  
3.9本章練習… ………………………………… 39  

第4章DOM基礎… …… ………… 41  
4.1 DOM簡介… ……………………………… 41  
4.1.1 DOM對象… …………………………… 41  
4.1.2 DOM結構… ………… ………………… 41  
4.2 建元素… ………………………………… 43  
4.3插入節點… ………………………………… 45  
4.3.1 prepend()和prependTo()… ……… 45  
4.3.2 append()和appendTo()… ………… 48  
4.3.3 before()和insertBefore()… ……… 50  
4.3.4 after ()和insertAfter()… …………… 52  
4.4刪除元素… ………………………………… 54  
4.4.1 remove()……………………………… 55  
4.4.2 detach()………………………………… 58  
4.4.3 empty()… ……………………………… 59  
4.5複製元素… ……………… ………………… 60  
4.6替換元素… ………………………………… 62  
4.6.1 replaceWith()… ……………………… 62  
4.6.2 replaceAll()… ………………………… 63  
4.7包裹元素… ………………………………… 64  
4.7.1 wrap()…………………………………… 64  
4.7.2 wrapAll()… …………………………… 65  
4.7.3 wrapInner()… ………………………… 66  
4.8遍曆元素………………………… ………… 67  
4.9本章練習… ………………… …………… 71  

第5章DOM進階… ……………… 73  
5.1屬性操作… ………………………………… 73  
5.1.1獲取屬性… ……………………………… 73  
5.1.2設置屬性… ……………………………… 74  
5.1.3刪除屬性… ……………………………… 77  
5.1.4 prop()方法………… …………………… 78  
5.2樣式操作… ………………………………… 80  
5.2.1 CSS屬性操作…………………………… 80  
5.2.2 CSS類名操作… ……………………… 83  
5.2.3個別樣式操作… ………………………… 87  
5.3內容操作… ………………………………… 94  
5.3 .1 html()… ………………………………… 94  
5.3.2 text()… ………………………………… 96  
5.3.3 val()……… ……………………………… 97  
5.4本章練習… ………………………………… 99  

第6章事件基礎… ……………… 101  
6.1事件簡介… …… ………………………… 101  
6.2頁面事件… ……………………………… 102  
6.2.1 JavaScript的onload事件………… 102  
6.2.2 jQuery的ready事件… …………… 103  
6.2.3 ready事件的4種寫法……………… 104  
6.2.4深入了解jQuery的ready事件…… 105  
6.3鼠標事件… ………… …………………… 107  
6.3.1鼠標單擊… …………………………… 107  
6.3.2鼠標（指針）移入和鼠標（指針）移出……… 109  
6.3.3鼠標按下和鼠標鬆開… ……………… 111  
6.4鍵盤事件… ……………………………… 112  
6.5表單事件… ……………………………… 115  
6.5. 1 focus和blur… ……………………… 115  
6.5.2 select… ……………………………… 117  
6.5.3 change… …………………………… 119  
6.6編輯事件… ……………………………… 122  
6.7滾動事件… ……………………………… 123  
6.8本章練習… ……………………………… 127 
 
第7章事件進階… ……………… 129  
7.1綁定事件… ……………………………… 129  
7.1.1為“ 已經存在的元素”綁定事件… … 129  
7.1.2為“動態創建的元素”綁定事件… … 130  
7.2解綁事件… ……………………………… 131  
7.3合成事件… ……………………………… 134  
7.4一次事件… …………………………… … 136  
7.5自定義事件… …………………………… 137  
7.6 event對象……………………………… 139  
7.6.1 event.type……………………… …… 140  
7.6.2 event.target………………………… 141  
7.6.3 event.which………………………… 142  
7.6.4 event.pageX和event.pageY…… 143  
7.6.5 keyCode… ………………………… 143  
7.7 this… …………………………………… 146  
7.8本章練習… ……………………………… 148 
 
第8章jQuery動畫……………… 149  
8.1 jQuery動畫簡介… …………………… 149  
8.2顯示與隱藏… …………………………… 150  
8.2.1 show()和hide()… ………………… 150  
8.2.2 toggle()… …………………………… 153  
8.3淡入與淡出… …………………………… 154  
8.3.1 fadeIn()和fadeOut()……………… 154  
8.3.2 fadeToggle()………………………… 156  
8.3.3 fadeTo()……………………………… 157  
8.4滑上與滑下…………………… ………… 158  
8.4.1 slideUp()和slideDown()… ……… 159  
8.4.2 slideToggle()… …………………… 160  
8.5自定義動畫… ……………………… …… 162  
8.5.1簡單動畫… …………………………… 162  
8.5.2累積動畫… …………………………… 165  
8.5.3回調函數… …………… ……………… 166  
8.6隊列動畫… ……………………………… 168  
8.7停止動畫… ……………………………… 171  
8.8延遲動畫……………… ………………… 174  
8.9判斷動畫狀態…………………………… 175  
8.10深入了解jQuery動畫………………… 177  
8.11本章練習………………………… ……… 178  

第9章過濾方法… ……………… 179  
9.1 jQuery過濾方法簡介… ……………… 179  
9.2類名過濾：hasClass() ……………… 179  
9.3下標過濾：eq()… ……………………… 181  
9.4判斷過濾：is()…………………………… 182  
9.5反向過濾：not()………………………… 184  
9.6表達式過濾：filter()、has() …………… 186  
9.6.1 filter()… ……………………………… 187  
9.6.2 has()… ……………………………… 189  
9.7本章練習… ……………………………… 190 
 
第10章查找方法………………… 191  
10.1 jQuery查找方法簡介… ……………… 191  
10.2查找祖先元素… ……………… ……… 191  
10.2.1 parent()……………………………… 191  
10.2.2 parents()…………………………… 194  
10.2.3 parentsUntil()……… ……………… 196  
10.3查找後代元素… ……………………… 197  
10.3.1 children()…………………………… 197  
10.3.2 find()………… ……………………… 198  
10.3.3 contents()… ……………………… 200  
10.4向前查找兄弟元素… ………………… 200  
10.4.1 prev()…… ……………… ………… 200  
10.4.2 prevAll()… ………………………… 201  
10.4.3 prevUntil()… ……………………… 202  
10.5向後查找兄弟元素… ………………… 203  
10.5.1 next()………………………………… 204  
10.5.2 nextAll()… ………………………… 205  
10.5.3 nextUntil()… …………… ………… 206  
10.6查找所有兄弟元素… ………………… 207  
10.7本章練習… …………………………… 209  

第11章工具函數… ……………… 211  
11.1工具函數簡介…………………………… 211  
11.2字符串操作……………………………… 211  
11.3 URL操作… …………………………… 212  
11.4數組操作………………………………… 213  
11.4.1判斷元素：$.inArray()……………… 214  
11.4.2合併數組：$.merge()……………… 215  
11.4.3轉換數組：$.makeArray()………… 215  
11.4.4過濾數組：$.grep()………………… 217  
11.4.5遍歷數組：$.each()………… …… 219  
11.5對像操作………………………………… 221  
11.6檢測操作………………………………… 222  
11.7自定義工具函數………………………… 227  
11.8本章練習………………………………… 228  
第12章開發插件………………… 230  
12.1 jQuery插件簡介… …………………… 230  
12.2 jQuery常用插件……………………… 231  
12.2.1文本溢出：dotdotdot.js …………… 231  
12.2.2延遲加載：lazyload.js… ………… 232  
12.2.3複製粘貼：zclip.js… ……………… 235  
12.2.4表單驗證：validate.js……… ……… 236  
12.3 jQuery插件…………………………… 238  
12.3.1方法類插件…………………………… 238  
12.3.2函數類插件… ……………… ……… 242  
12.4本章練習… …………………………… 244 
 
第13章Ajax操作… …………… 245  
13.1搭建服務器環境………………………… 245  
13.2 Ajax簡介… …………………………… 247  
13.3 load()方法… ……………… ……… 248  
13.3.1 load()方法簡介… ………………… 248  
13.3.2傳遞數據… ………………………… 252  
13.3.3回調函數… ………………………… 253  
13.4 $.get()方法……………………… …… 254  
13.5 $.post()方法… ……………………… 256  
13.6 $.getJSON()方法…………………… 259  
13.7 $.getScript()方法……………… …… 261  
13.8 $.ajax()方法… ……………………… 264  
13.9本章練習… …………………………… 267  

第14章*級技巧………………… 268  
14.1 index()方法…………………………… 268  
14.2鍊式調用… …………………………… 271  
14.3 jQuery對象與DOM對象…………… 273  
14.4解決庫衝突… ………………………… 276  
14.5 jQuery CDN… ……………………… 279  
14.5.1 CDN簡介… ………………………… 279  
14.5.2 jQuery CDN… …………………… 280  
14.6本章練習… …………………………… 281  
附錄A DOM操作方法… ……… 282  
附錄B常見的事件 …………… 284  
附錄C常見的動畫… …………… 285  
附錄D過濾方法… ……………… 286  
附錄E查找方法… ……………… 287