從0到1 jQuery快速上手
內容描述
作者根據自己多年的前後端開發經驗,站在完全零基礎讀者的角度,
基於jQuery 1.12.x版本,詳盡介紹了jQuery的基礎知識及開發技巧。
全書分為14章,前10章主要介紹jQuery的基本技術,包括常用選擇器、
DOM操作、事件操作、jQuery動畫、過濾方法、查找方法等;
後4章主要介紹jQuery的進階技巧,包括工具函數、開發插件、Ajax操作以及*級技巧。
此外,本書不但配備了所有案例的源代碼,
作者還結合實際工作和前端面試的經驗,精選了很多高質量的練習題。
為了方便高校老師教學,本書還提供了配套的PPT課件。
本書適合作為前端開發人員的參考書,也可以作為大中專院校相關專業的教學參考書。
目錄大綱
目錄:
第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
作者介紹
莫振傑
畢業於暨南大學信科院計算機科學與技術專業,
從事前後端開發4年多,開發過綠葉學習網、
廣州智能工程研究會網站、大量在線應用工具及其他各種類型網站,
著有多本編程書且銷量過萬,現為綠葉學習網的站長,
該網站用於分享其在前後端開發中的一些經驗,
其製作的前後端開發在線教程在互聯網引起廣泛關注,
每一個教程都廣受網友稱讚與推崇,今年還開發了系列前端線上付費課程。