jQuery網(wǎng)頁(yè)特效設(shè)計(jì)基礎(chǔ)教程（慕課版）

第 1章 JavaScript基礎(chǔ) 1
1．1 JavaScript概述 2
1．1．1 什么是JavaScript 2
1．1．2 JavaScript的應(yīng)用領(lǐng)域 2
1．1．3 JavaScript的特點(diǎn) 4
1．2 JavaScript的開(kāi)發(fā)工具 5
1．2．1 使用記事本開(kāi)發(fā) 5
1．2．2 使用Dreamweaver開(kāi)發(fā) 5
1．3 編寫第 一個(gè)JavaScript程序 8
1．3．1 編寫JavaScript程序 8
1．3．2 運(yùn)行JavaScript程序 10
1．3．3 JavaScript程序的出錯(cuò)類型 11
1．3．4 JavaScript的3種調(diào)試方式 12
1．4 JavaScript庫(kù) 13
1．4．1 什么是JavaScript庫(kù) 13
1．4．2 常用的JavaScript庫(kù) 13
知識(shí)點(diǎn)提煉 15
習(xí)題 15
第 2章 初識(shí)jQuery 16
2．1 jQuery概述 17
2．1．1 jQuery的應(yīng)用 17
2．1．2 jQuery的特點(diǎn) 18
2．1．3 jQuery的版本 19
2．1．4 jQuery版本的選擇 21
2．2 jQuery下載與配置 21
2．2．1 下載jQuery 21
2．2．2 配置jQuery 22
2．2．3 我的第 一個(gè)jQuery腳本 22
2．3 jQuery對(duì)象和DOM對(duì)象 23
2．3．1 jQuery對(duì)象和DOM對(duì)象簡(jiǎn)介 23
2．3．2 jQuery對(duì)象和DOM對(duì)象的相互轉(zhuǎn)換 24
2．4 解決jQuery和其他庫(kù)的沖突 26
2．4．1 jQuery庫(kù)在其他庫(kù)之前導(dǎo)入 26
2．4．2 jQuery庫(kù)在其他庫(kù)之后導(dǎo)入 27
2．5 jQuery插件簡(jiǎn)介 28
2．5．1 插件的使用 28
2．5．2 流行的插件 28
知識(shí)點(diǎn)提煉 30
習(xí)題 31
第3章 使用jQuery選擇器 32
3．1 jQuery的工廠函數(shù) 33
3．2 什么是jQuery選擇器 33
3．3 jQuery選擇器的優(yōu)勢(shì) 33
3．3．1 代碼更簡(jiǎn)單 33
3．3．2 支持CSS1到CSS3選擇器 33
3．3．3 完善的檢測(cè)機(jī)制 33
3．4 基本選擇器 35
3．4．1 ID選擇器（#id） 35
3．4．2 元素選擇器（element） 36
3．4．3 類名選擇器（．class） 37
3．4．4 復(fù)合選擇器（selector1，selector2，selectorN） 38
3．4．5 通配符選擇器（*） 39
3．4．6 使用選擇器獲取超鏈接地址 39
3．5 層次選擇器 41
3．5．1 ancestor descendant選擇器 41
3．5．2 parent>child選擇器 43
3．5．3 prev+next選擇器 44
3．5．4 prev～siblings選擇器 45
3．6 過(guò)濾選擇器 46
3．6．1 簡(jiǎn)單過(guò)濾器 46
3．6．2 內(nèi)容過(guò)濾器 48
3．6．3 可見(jiàn)性過(guò)濾器 49
3．6．4 表單對(duì)象的屬性過(guò)濾器 50
3．6．5 子元素過(guò)濾器 51
3．7 屬性選擇器 52
3．8 表單選擇器 53
3．9 混淆選擇器 54
3．10 選擇器中的一些注意事項(xiàng) 55
3．10．1 選擇器中含有特殊符號(hào)的注意事項(xiàng) 55
3．10．2 選擇器中含有空格的注意事項(xiàng) 55
3．11 綜合實(shí)例：表格隔行換色及鼠標(biāo)指針指向行變色 56
知識(shí)點(diǎn)提煉 57
習(xí)題 58
第4章 使用jQuery操作DOM 59
4．1 DOM操作的分類 60
4．2 對(duì)元素內(nèi)容和值進(jìn)行操作 60
4．2．1 對(duì)元素內(nèi)容進(jìn)行操作 60
4．2．2 對(duì)元素值進(jìn)行操作 63
4．3 對(duì)DOM文檔節(jié)點(diǎn)進(jìn)行操作 64
4．3．1 創(chuàng)建節(jié)點(diǎn) 64
4．3．2 查找節(jié)點(diǎn) 65
4．3．3 插入節(jié)點(diǎn) 65
4．3．4 刪除、復(fù)制與替換節(jié)點(diǎn) 67
4．3．5 包裹節(jié)點(diǎn) 70
4．3．6 遍歷節(jié)點(diǎn) 73
4．4 對(duì)元素屬性進(jìn)行操作 74
4．5 對(duì)元素的CSS樣式進(jìn)行操作 75
4．5．1 通過(guò)修改CSS類實(shí)現(xiàn) 75
4．5．2 通過(guò)修改CSS屬性實(shí)現(xiàn) 75
4．6 綜合實(shí)例：實(shí)現(xiàn)我的開(kāi)心小農(nóng)場(chǎng) 76
知識(shí)點(diǎn)提煉 77
習(xí)題 78
第5章 jQuery中的事件處理和動(dòng)畫效果 79
5．1 jQuery中的事件處理 80
5．1．1 頁(yè)面加載響應(yīng)事件 80
5．1．2 jQuery中的事件 80
5．1．3 事件綁定 82
5．1．4 模擬用戶操作 85
5．1．5 事件捕獲與事件冒泡 87
5．2 jQuery中的動(dòng)畫效果 91
5．2．1 隱藏匹配元素 91
5．2．2 顯示匹配元素 91
5．2．3 切換元素的可見(jiàn)狀態(tài) 93
5．2．4 淡入淡出的動(dòng)畫效果 93
5．2．5 滑動(dòng)效果 94
5．2．6 自定義的動(dòng)畫效果 97
5．3 綜合實(shí)例：實(shí)現(xiàn)圖片傳送帶 99
知識(shí)點(diǎn)提煉 101
習(xí)題 102
第6章 使用jQuery操作表單和表格 103
6．1 HTML表單概述 104
6．1．1 表單標(biāo)記 104
6．1．2 輸入標(biāo)記 105
6．1．3 文本域標(biāo)記 109
6．1．4 菜單和列表標(biāo)記、 110
6．2 使用jQuery操作表單元素 111
6．2．1 操作文本框 111
6．2．2 操作文本域 112
6．2．3 操作單選按鈕和復(fù)選框 115
6．2．4 操作下拉框 117
6．2．5 表單驗(yàn)證 118
6．3 使用jQuery操作表格 120
6．3．1 控制表格顏色顯示 120
6．3．2 表格的展開(kāi)與關(guān)閉 122
6．3．3 表格內(nèi)容的篩選 124
6．4 綜合實(shí)例：刪除記錄時(shí)的提示效果 125
知識(shí)點(diǎn)提煉 126
習(xí)題 127
第7章 Ajax在jQuery中的應(yīng)用 128
7．1 Ajax技術(shù)簡(jiǎn)介 129
7．1．1 Ajax概述 129
7．1．2 Ajax技術(shù)的優(yōu)點(diǎn) 129
7．1．3 Ajax技術(shù)的缺點(diǎn) 130
7．2 安裝Web運(yùn)行環(huán)境——AppServ 130
7．3 通過(guò)JavaScript應(yīng)用Ajax 133
7．4 jQuery中的Ajax應(yīng)用 134
7．4．1 load()方法 135
7．4．2 使用$．get()方法請(qǐng)求數(shù)據(jù) 136
7．4．3 使用$．post()方法請(qǐng)求數(shù)據(jù) 137
7．4．4 使用$．getScript()方法加載JS文件 138
7．4．5 使用$．getJSON()方法加載JSON文件 139
7．4．6 使用$．a(chǎn)jax()方法請(qǐng)求數(shù)據(jù) 140
7．4．7 使用serialize()方法序列化表單 141
7．5 Ajax的全局事件 143
7．5．1 Ajax全局事件的參數(shù)及功能 143
7．5．2 ajaxStart與ajaxStop全局事件 143
7．6 綜合實(shí)例：使用Ajax實(shí)現(xiàn)留言板即時(shí)更新 144
知識(shí)點(diǎn)提煉 146
習(xí)題 146
第8章 使用jQuery UI插件 147
8．1 初識(shí)jQuery UI插件 148
8．1．1 jQuery UI概述 148
8．1．2 jQuery UI的下載 148
8．1．3 jQuery UI的使用 149
8．1．4 jQuery UI的工作原理 150
8．1．5 jQuery UI中的插件 152
8．2 jQuery UI的常用插件 152
8．2．1 折疊面板（Accordion）的使用 152
8．2．2 自動(dòng)完成（Autocomplete）插件的使用 155
8．2．3 按鈕（Button）的使用 158
8．2．4 日期選擇器（Datepicker）的使用 160
8．2．5 對(duì)話框（Dialog）的使用 163
8．2．6 菜單（Menu）的使用 166
8．2．7 進(jìn)度條（Progressbar）的使用 168
8．2．8 滑塊（Slider）的使用 170
8．2．9 旋轉(zhuǎn)器（Spinner）的使用 172
8．2．10 標(biāo)簽頁(yè)（Tabs）的使用 173
8．2．11 工具提示框（Tooltip）的使用 175
8．3 jQuery UI的特效 177
8．3．1 拖動(dòng)特效（Draggable）的使用 177
8．3．2 放置特效（Droppable）的使用 178
8．3．3 縮放特效（Resizable）的使用 179
8．3．4 選擇特效（Selectable）的使用 180
8．3．5 排序特效（Sortable）的使用 181
8．3．6 顯示特效（show）的使用 182
8．3．7 隱藏特效（hide）的使用 184
8．3．8 切換特效（toggle）的使用 186
8．4 綜合實(shí)例：使用jQuery實(shí)現(xiàn)許愿墻 188
知識(shí)點(diǎn)提煉 190
習(xí)題 191
第9章 常用的第三方j(luò)Query插件 192
9．1 jQuery插件概述 193
9．1．1 什么是jQuery插件 193
9．1．2 常用的第三方j(luò)Query插件 193
9．1．3 如何調(diào)用第三方j(luò)Query插件 193
9．2 常用jQuery插件的使用 194
9．2．1 uploadify插件（文件上傳） 194
9．2．2 zTree插件（樹(shù)菜單） 198
9．2．3 Nivo Slider插件（圖片切換） 202
9．2．4 Pagination插件（數(shù)據(jù)分頁(yè)） 205
9．2．5 jQZoom插件（圖片放大鏡） 207
9．3 綜合實(shí)例：使用ColorPicker插件制作顏色選擇器 209
知識(shí)點(diǎn)提煉 210
習(xí)題 210
第 10章 jQuery性能優(yōu)化與技巧 211
10．1 jQuery性能優(yōu)化 212
10．2 jQuery常用技巧 216
知識(shí)點(diǎn)提煉 221
習(xí)題 222
第 11章 jQuery在HTML5中的應(yīng)用 223
11．1 HTML5基礎(chǔ) 224
11．1．1 HTML5的新特性 224
11．1．2 瀏覽器對(duì)HTML5的支持 224
11．2 jQuery與HTML5編程 226
11．2．1 顯示文件上傳的進(jìn)度條 226
11．2．2 Canvas繪圖 228
11．2．3 jQuery+HTML5實(shí)現(xiàn)圖片旋轉(zhuǎn)效果 230
11．2．4 基于HTML5播放聲音的jQuery插件audioPlay 232
11．2．5 Web Storage編程 233
11．3 綜合實(shí)例：旅游信息網(wǎng)前臺(tái)頁(yè)面設(shè)計(jì) 236
11．3．1 網(wǎng)站預(yù)覽 236
11．3．2 網(wǎng)站主體結(jié)構(gòu)設(shè)計(jì) 239
11．3．3 HTML5結(jié)構(gòu)元素的使用 239
11．3．4 網(wǎng)站公共部分設(shè)計(jì) 240
11．3．5 網(wǎng)站主頁(yè)設(shè)計(jì) 244
11．3．6 留下足跡頁(yè)面設(shè)計(jì) 246
知識(shí)點(diǎn)提煉 248
習(xí)題 248
第 12章 綜合實(shí)戰(zhàn)——使用jQuery實(shí)現(xiàn)攜程網(wǎng)站特效 249
12．1 網(wǎng)站特效 250
12．2 特效需求 250
12．2．1 網(wǎng)站注冊(cè)表單布局設(shè)計(jì) 250
12．2．2 倒計(jì)時(shí)交互設(shè)計(jì) 250
12．2．3 網(wǎng)站登錄布局與交互設(shè)計(jì) 250
12．2．4 導(dǎo)航菜單設(shè)計(jì) 251
12．2．5 海報(bào)輪播效果設(shè)計(jì) 251
12．2．6 頁(yè)簽切換效果設(shè)計(jì) 251
12．2．7 左右滑動(dòng)效果設(shè)計(jì) 252
12．2．8 手風(fēng)琴效果設(shè)計(jì) 252
12．2．9 圖片放大縮小效果制作 253
12．3 關(guān)鍵知識(shí)點(diǎn) 253
12．4 模塊設(shè)計(jì)實(shí)現(xiàn) 254
12．4．1 網(wǎng)站注冊(cè)表單布局設(shè)計(jì) 254
12．4．2 倒計(jì)時(shí)交互設(shè)計(jì) 260
12．4．3 網(wǎng)站登錄布局與交互設(shè)計(jì) 262
12．4．4 導(dǎo)航菜單設(shè)計(jì) 266
12．4．5 海報(bào)輪播效果制作 269
12．4．6 頁(yè)簽切換效果設(shè)計(jì) 272
12．4．7 左右滑動(dòng)切換效果設(shè)計(jì) 276
12．4．8 手風(fēng)琴效果菜單設(shè)計(jì) 278
12．4．9 圖片放大縮小效果制作 281
12．5 本章總結(jié) 284