本書主要學(xué)習(xí)JavaScript中兩個(gè)必備的知識(shí)點(diǎn):**個(gè)為AJAX,它是客戶端JavaScript與后端服務(wù)器進(jìn)行交流的一種技術(shù);第二個(gè)為jQuery,它是JavaScript目前的一個(gè)主流庫(kù)文件。附加學(xué)習(xí)Node.js知識(shí),以此來(lái)搭建后臺(tái)服務(wù)器,輔助讀者更全面、更系統(tǒng)地完成AJAX學(xué)習(xí)。AJAX是一項(xiàng)非常重要的技術(shù),幾乎所有頁(yè)面要實(shí)現(xiàn)更好的體驗(yàn)都逃不過(guò)AJAX技術(shù),而且近年來(lái)逐漸流行的Web APP幾乎都是以AJAX為基礎(chǔ)來(lái)實(shí)現(xiàn)的。因此,本書的AJAX部分結(jié)合目前實(shí)際開發(fā)進(jìn)行詳細(xì)講解,首先結(jié)合學(xué)習(xí)Node.js,使用express框架搭建Node.js服務(wù)器;然后著重講解AJAX技術(shù)原理,帶領(lǐng)讀者進(jìn)行實(shí)際運(yùn)用和封裝;最后詳細(xì)講解AJAX跨域和同步、異步等常見(jiàn)問(wèn)題的處理方式。而jQuery是一個(gè)重要的前端框架,大量的前端特效插件也是基于此實(shí)現(xiàn)的。因此,本書jQuery部分主要深入學(xué)習(xí)原理知識(shí),對(duì)jQuery的DOM操作、事件處理、動(dòng)畫效果及jQuery的AJAX應(yīng)用等方面進(jìn)行詳細(xì)講解,并通過(guò)大量實(shí)例貫穿整個(gè)jQuery知識(shí)體系。本書是“跟兄弟連學(xué)HTML5系列教程”的第四本書,需要了解JavaScript的基礎(chǔ)語(yǔ)法和DOM部分。所以本書以實(shí)例為主,不再過(guò)多地講解語(yǔ)法等基礎(chǔ)知識(shí)點(diǎn),讓讀者可以從具體實(shí)例中吸取實(shí)戰(zhàn)經(jīng)驗(yàn)。
為了讓前端初學(xué)者少走彎路,快速而輕松地學(xué)習(xí)HTML5和JavaScript編程,我們結(jié)合新技術(shù)和兄弟連多年的教學(xué)經(jīng)驗(yàn)積累,再通過(guò)對(duì)企業(yè)實(shí)際應(yīng)用的調(diào)研,編寫了一整套HTML5系列圖書,共5本,包括《細(xì)說(shuō)網(wǎng)頁(yè)制作》、《細(xì)說(shuō)JavaScript》、《細(xì)說(shuō)DOM編程》、《細(xì)說(shuō)AJAX與jQuery》和《細(xì)說(shuō)HTML5高級(jí)API》,每一本書都是不同層次的完整內(nèi)容,不僅給初學(xué)者安排了循序漸進(jìn)的學(xué)習(xí)過(guò)程,也便于不同層次的讀者選擇;既適合沒(méi)有編程基礎(chǔ)的前端初學(xué)者作為入門教程,也適合正在從事前端開發(fā)的人員作為技術(shù)提升參考資料。本套圖書編寫的初衷是為了緊跟新技術(shù)和兄弟連IT教育HTML5學(xué)科的教學(xué)發(fā)展,作為本校培訓(xùn)教程使用,也可作為大、中專院校和其他培訓(xùn)學(xué)校的教材。同時(shí),對(duì)于前端開發(fā)愛(ài)好者,本書也有較高的參考價(jià)值。
兄弟連IT教育,成立于2006年,中國(guó)程序員培訓(xùn)領(lǐng)導(dǎo)者。兄弟連以“優(yōu)秀的教學(xué)、嚴(yán)格的管理、職業(yè)素質(zhì)課貫穿始終”而聞名,現(xiàn)已開設(shè)PHP、UI、HTML5、Java/Android、iOS、Linux等眾多課程,分別在北京、上海、廣州、沈陽(yáng)、揚(yáng)州、蘇州、鄭州、濟(jì)南設(shè)立校區(qū),今后會(huì)陸續(xù)在成都、西安、武漢等地建設(shè)校區(qū),每年有數(shù)十萬(wàn)名學(xué)員受益于兄弟連的職業(yè)培訓(xùn)、教學(xué)視頻、網(wǎng)絡(luò)公開課、院校講座、出版書籍。我們相信,我們不僅僅是老師,更是學(xué)員的夢(mèng)想守護(hù)者與職場(chǎng)引路人。
第1章 AJAX與jQuery概述 1
1.1 AJAX概述 1
1.2 AJAX的發(fā)展史 2
1.3 AJAX的應(yīng)用場(chǎng)景 2
1.4 Node.js概述 4
1.5 jQuery概述 5
1.6 jQuery的發(fā)展史 5
1.7 jQuery的應(yīng)用 6
1.8 本章小結(jié) 9
練習(xí)題 9
第2章 搭建Node.js服務(wù)器 11
2.1 HTTP原理 11
2.1.1 網(wǎng)絡(luò)通信 12
2.1.2 HTTP協(xié)議及其工作流程 17
2.1.3 請(qǐng)求和響應(yīng) 20
2.2 安裝Node.js 21
2.2.1 下載并安裝 21
2.2.2 檢查安裝結(jié)果 22
2.2.3 使用Node.js 24
2.3 搭建原生HTTP服務(wù)器 25
2.4 使用express框架 26
2.4.1 express框架簡(jiǎn)介 27
2.4.2 express框架安裝 27
2.4.3 express框架應(yīng)用 30
2.4.4 模板數(shù)據(jù)渲染 34
2.4.5 路由分離 35
2.5 本章小結(jié) 36
第3章 揭開AJAX的神秘面紗 37
3.1 AJAX的第一個(gè)實(shí)例程序 37
3.2 同步和異步 39
3.2.1 同步 39
3.2.2 異步 39
3.2.3 同步和異步的適用場(chǎng)景 41
3.3 XMLHttpRequest對(duì)象 43
3.3.1 XMLHttpRequest對(duì)象的方法 44
3.3.2 XMLHttpRequest對(duì)象的屬性和事件 47
3.4 原生AJAX的例子 51
3.4.1 POST請(qǐng)求實(shí)例 51
3.4.2 GET請(qǐng)求實(shí)例 53
3.5 封裝AJAX對(duì)象 54
3.5.1 需求分析 55
3.5.2 封裝get()方法 55
3.5.3 封裝post()方法 58
3.6 跨域請(qǐng)求 60
3.6.1 什么是跨域請(qǐng)求 60
3.6.2 如何處理跨域請(qǐng)求 62
3.7 AJAX的優(yōu)缺點(diǎn) 80
3.7.1 AJAX的優(yōu)點(diǎn) 80
3.7.2 AJAX的缺點(diǎn) 81
3.8 本章小結(jié) 81
練習(xí)題 81
第4章 AJAX在項(xiàng)目中的應(yīng)用 84
4.1 瀑布流無(wú)限加載 84
4.2 表單驗(yàn)證 87
4.2.1 表單常用的事件 87
4.2.2 網(wǎng)頁(yè)表單驗(yàn)證實(shí)例 88
第5章 jQuery快速入門 97
5.1 jQuery概述及其功能 97
5.1.1 訪問(wèn)和操作DOM節(jié)點(diǎn) 98
5.1.2 對(duì)頁(yè)面的CSS動(dòng)態(tài)控制 98
5.1.3 對(duì)頁(yè)面的事件處理 98
5.1.4 對(duì)頁(yè)面的動(dòng)畫效果的支持 99
5.1.5 對(duì)AJAX技術(shù)的封裝 99
5.1.6 可以支持大量的插件 100
5.2 配置jQuery環(huán)境 100
5.2.1 jQuery的庫(kù)類型 101
5.2.2 引入jQuery庫(kù)文件 101
5.3 第一個(gè)jQuery程序 101
5.3.1 JavaScript代碼的加載順序 102
5.3.2 JavaScript代碼的注意事項(xiàng) 104
5.4 jQuery的代碼風(fēng)格 106
5.4.1 “$”美元符號(hào)的作用 106
5.4.2 鏈?zhǔn)讲僮鲿鴮懘a 107
5.5 六大功能的簡(jiǎn)單應(yīng)用 109
5.5.1 jQuery訪問(wèn)DOM節(jié)點(diǎn) 109
5.5.2 jQuery對(duì)頁(yè)面的事件處理 112
5.5.3 jQuery動(dòng)態(tài)控制頁(yè)面CSS 113
5.5.4 jQuery處理頁(yè)面動(dòng)畫效果 116
5.5.5 jQuery的AJAX技術(shù)應(yīng)用 118
5.6 本章小結(jié) 119
練習(xí)題 120
第6章 jQuery選擇器和過(guò)濾 122
6.1 jQuery選擇器介紹 122
6.1.1 CSS選擇器 122
6.1.2 jQuery選擇器 123
6.2 jQuery選擇器的特點(diǎn) 124
6.2.1 簡(jiǎn)便而又靈活的寫法 124
6.2.2 完善的檢測(cè)機(jī)制 124
6.3 細(xì)談jQuery選擇器 127
6.3.1 基本選擇器 127
6.3.2 層次選擇器 129
6.3.3 過(guò)濾選擇器 132
6.3.4 表單選擇器 145
6.4 本章小結(jié) 148
練習(xí)題 148
第7章 jQuery的DOM操作 151
7.1 什么是DOM 151
7.1.1 DOM概述 151
7.1.2 DOM樹操作的分類 153
7.2 元素節(jié)點(diǎn)的操作 153
7.2.1 獲取元素節(jié)點(diǎn) 154
7.2.2 創(chuàng)建元素節(jié)點(diǎn) 154
7.2.3 插入元素節(jié)點(diǎn) 156
7.2.4 包裹元素節(jié)點(diǎn) 165
7.2.5 替換元素節(jié)點(diǎn) 167
7.2.6 刪除元素節(jié)點(diǎn) 168
7.2.7 復(fù)制元素節(jié)點(diǎn) 170
7.3 屬性節(jié)點(diǎn)的操作 171
7.3.1 普通的屬性節(jié)點(diǎn)操作 171
7.3.2 元素的樣式操作――操作class屬性 172
7.3.3 元素的樣式操作――操作CSS屬性 174
7.4 文本節(jié)點(diǎn)的操作 176
7.5 遍歷元素節(jié)點(diǎn) 178
7.6 本章小結(jié) 180
練習(xí)題 181
第8章 jQuery的事件處理 183
8.1 jQuery事件介紹 183
8.2 瀏覽器載入文檔事件 184
8.2.1 執(zhí)行時(shí)機(jī) 184
8.2.2 執(zhí)行次數(shù) 185
8.2.3 簡(jiǎn)寫方式 186
8.3 jQuery的事件綁定 186
8.4 jQuery的事件冒泡 189
8.4.1 產(chǎn)生冒泡的現(xiàn)象 189
8.4.2 處理冒泡問(wèn)題 190
8.5 jQuery事件對(duì)象的屬性和方法 192
8.6 jQuery的事件委派 193
8.6.1 delegate()方法:實(shí)現(xiàn)事件委派 193
8.6.2 undelegate()方法:取消事件委派 194
8.7 jQuery的事件模擬操作 195
8.8 jQuery的on()和off()方法 197
8.9 jQuery中事件處理的實(shí)戰(zhàn)講解 197
8.9.1 鼠標(biāo)跟隨實(shí)例 197
8.9.2 輪播圖實(shí)例 200
8.9.3 輪播圖的其他實(shí)例 211
8.10 本章小結(jié) 211
練習(xí)題 212
第9章 jQuery的動(dòng)畫效果 214
9.1 show()和hide()方法 214
9.2 slideUp()和slideDown()方法 216
9.3 fadeIn()和fadeOut()方法 218
9.4 animate()方法――自定義動(dòng)畫 219
9.4.1 自定義簡(jiǎn)單動(dòng)畫實(shí)例 219
9.4.2 動(dòng)畫隊(duì)列 221
9.4.3 處理動(dòng)畫隊(duì)列操作方法 222
9.5 其他動(dòng)畫操作方法 226
9.5.1 toggle()方法 226
9.5.2 slideToggle()和fadeToggle()方法 227
9.5.3 fadeTo()方法 227
9.6 本章小結(jié) 228
練習(xí)題 228
第10章 jQuery的AJAX應(yīng)用 230
10.1 jQuery的AJAX應(yīng)用介紹 230
10.2 jQuery的load()方法 231
10.3 jQuery的$.get()和$.post()方法 234
10.3.1 $.get()方法 234
10.3.2 $.post()方法 237
10.4 jQuery的$.getScript()方法 239
10.5 jQuery的$.getJSON()方法 240
10.6 jQuery的$.a(chǎn)jax()方法 242
10.7 jQuery的AJAX全局事件 245
10.8 jQuery的其他常用方法介紹 247
10.8.1 serialize()和serializeArray()方法 247
10.8.2 $.a(chǎn)jaxSetup()方法全局設(shè)置AJAX配置屬性 249
10.9 綜合實(shí)例――使用jQuery的AJAX實(shí)現(xiàn)廣播效果 249
10.10 本章小結(jié) 253
練習(xí)題 253
附錄A jQuery速查表 255