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