目　錄

第 1章　JavaScript簡史　1
1．1　JavaScript的起源　1
1．2　DOM　2
1．3　瀏覽器戰(zhàn)爭　3
1．3．1　DHTML　3
1．3．2　瀏覽器之間的沖突　3
1．4　制定標(biāo)準(zhǔn)　4
1．4．1　瀏覽器以外的考慮　4
1．4．2　瀏覽器戰(zhàn)爭的結(jié)局　5
1．4．3　嶄新的起點(diǎn)　5
1．5　小結(jié)　6

第 2章　JavaScript語法　8
2．1　準(zhǔn)備工作　8
2．2　語法　10
2．2．1　語句　10
2．2．2　注釋　10
2．2．3　變量　11
2．2．4　數(shù)據(jù)類型　14
2．2．5　數(shù)組　16
2．2．6　對象　18
2．3　操作　19
2．4　條件語句　21
2．4．1　比較操作符　22
2．4．2　邏輯操作符　23
2．5　循環(huán)語句　24
2．5．1　while循環(huán)　24
2．5．2　for循環(huán)　25
2．6　函數(shù)　26
2．7　對象　29
2．7．1　內(nèi)建對象　30
2．7．2　宿主對象　31
2．8　小結(jié)　31

第3章　DOM　32
3．1　文檔：DOM中的“D”　32
3．2　對象：DOM中的“O”　32
3．3　模型：DOM中的“M”　33
3．4　節(jié)點(diǎn)　35
3．4．1　元素節(jié)點(diǎn)　35
3．4．2　文本節(jié)點(diǎn)　35
3．4．3　屬性節(jié)點(diǎn)　36
3．4．4　CSS　36
3．4．5　獲取元素　38
3．4．6　盤點(diǎn)知識點(diǎn)　42
3．5　獲取和設(shè)置屬性　43
3．5．1　getAttribute　43
3．5．2　setAttribute　44
3．6　小結(jié)　45

第4章　案例研究：JavaScript圖片庫　46
4．1　標(biāo)記　46
4．2　JavaScript　48
4．2．1　非DOM解決方案　49
4．2．2　**終的函數(shù)代碼清單　50
4．3　應(yīng)用這個(gè)JavaScript函數(shù)　50
4．4　對這個(gè)函數(shù)進(jìn)行擴(kuò)展　52
4．4．1　childNodes屬性　53
4．4．2　nodeType屬性　54
4．4．3　在標(biāo)記里增加一段描述　54
4．4．4　用JavaScript改變這段描述　55
4．4．5　nodeValue屬性　56
4．4．6　firstChild和lastChild屬性　56
4．4．7　利用nodeValue屬性刷新這段描述　57
4．5　小結(jié)　60

第5章　**佳實(shí)踐　61
5．1　過去的錯(cuò)誤　61
5．1．1　不要怪罪JavaScript　61
5．1．2　Flash的遭遇　62
5．1．3　質(zhì)疑一切　63
5．2　平穩(wěn)退化　63
5．2．1　“javascript：”偽協(xié)議　64
5．2．2　內(nèi)嵌的事件處理函數(shù)　65
5．2．3　誰關(guān)心這個(gè)　65
5．3　向CSS學(xué)習(xí)　66
5．3．1　結(jié)構(gòu)與樣式的分離　66
5．3．2　漸進(jìn)增強(qiáng)　67
5．4　分離JavaScript　68
5．5　向后兼容　70
5．5．1　對象檢測　70
5．5．2　瀏覽器嗅探技術(shù)　71
5．6　性能考慮　72
5．6．1　盡量少訪問DOM和盡量減少標(biāo)記　72
5．6．2　合并和放置腳本　73
5．6．3　壓縮腳本　73
5．7　小結(jié)　74

第6章　案例研究：圖片庫改進(jìn)版　75
6．1　快速回顧　75
6．2　它支持平穩(wěn)退化嗎　76
6．3　它的JavaScript與HTML標(biāo)記是分離的嗎　77
6．3．1　添加事件處理函數(shù)　77
6．3．2　共享onload事件　82
6．4　不要做太多的假設(shè)　84
6．5　優(yōu)化　86
6．6　鍵盤訪問　88
6．7　把JavaScript與CSS結(jié)合起來　90
6．8　DOM　Core和HTML-DOM　93
6．9　小結(jié)　94

第7章　動(dòng)態(tài)創(chuàng)建標(biāo)記　96
7．1　一些傳統(tǒng)方法　96
7．1．1　document．write　96
7．1．2　innerHTML屬性　98
7．2　DOM方法　101
7．2．1　createElement方法　101
7．2．2　appendChild方法　102
7．2．3　createTextNode方法　103
7．2．4　一個(gè)更復(fù)雜的組合　105
7．3　重回圖片庫　107
7．3．1　在已有元素前插入一個(gè)新元素　108
7．3．2　在現(xiàn)有方法后插入一個(gè)新元素　109
7．3．3　圖片庫二次改進(jìn)版　111
7．4　Ajax　114
7．4．1　XMLHttpRequest對象　115
7．4．2　漸進(jìn)增強(qiáng)與Ajax　119
7．4．3　Hijax　120
7．5　小結(jié)　121

第8章　充實(shí)文檔的內(nèi)容　122
8．1　不應(yīng)該做什么　122
8．2　把“不可見”變成“可見”　123
8．3　內(nèi)容　123
8．3．1　選用HTML、XHTML還是HTML5　124
8．3．2　CSS　126
8．3．3　JavaScript　127
8．4　顯示“縮略語列表”　127
8．4．1　編寫displayAbbreviations函數(shù)　128
8．4．2　創(chuàng)建標(biāo)記　130
8．4．3　一個(gè)瀏覽器“地雷”　135
8．5　顯示“文獻(xiàn)來源鏈接表”　138
8．6　顯示“快捷鍵清單”　143
8．7　檢索和添加信息　146
8．8　小結(jié)　147

第9章　CSS-DOM　148
9．1　三位一體的網(wǎng)頁　148
9．1．1　結(jié)構(gòu)層　148
9．1．2　表示層　148
9．1．3　行為層　149
9．1．4　分離　150
9．2　style屬性　150
9．2．1　獲取樣式　151
9．2．2　設(shè)置樣式　156
9．3　何時(shí)該用DOM腳本設(shè)置樣式　158
9．3．1　根據(jù)元素在節(jié)點(diǎn)樹里的位置來設(shè)置樣式　158
9．3．2　根據(jù)某種條件反復(fù)設(shè)置某種樣式　161
9．3．3　響應(yīng)事件　165
9．4　className屬性　167
9．5　小結(jié)　171

第 10章　用JavaScript實(shí)現(xiàn)動(dòng)畫效果　172
10．1　動(dòng)畫基礎(chǔ)知識　172
10．1．1　位置　172
10．1．2　時(shí)間　175
10．1．3　時(shí)間遞增量　175
10．1．4　抽象　178
10．2　實(shí)用的動(dòng)畫　184
10．2．1　提出問題　184
10．2．2　解決問題　186
10．2．3　CSS　187
10．2．4　JavaScript　189
10．2．5　變量作用域問題　192
10．2．6　改進(jìn)動(dòng)畫效果　193
10．2．7　添加安全檢查　196
10．2．8　生成HTML標(biāo)記　198
10．3　小結(jié)　200

第 11章　HTML5　201
11．1　HTML5簡介　201
11．2　來自朋友的忠告　203
11．3　幾個(gè)示例　204
11．3．1　Canvas　205
11．3．2　音頻和視頻　209
11．3．3　表單　215
11．4　HTML5還有其他特性嗎　219
11．5　小結(jié)　219

第 12章　綜合示例　220
12．1　項(xiàng)目簡介　220
12．1．1　原始資料　220
12．1．2　站點(diǎn)結(jié)構(gòu)　220
12．1．3　頁面結(jié)構(gòu)　221
12．2　設(shè)計(jì)　222
12．3　CSS　223
12．3．1　顏色　225
12．3．2　布局　226
12．3．3　版式　228
12．4　標(biāo)記　229
12．5　JavaScript　230
12．5．1　頁面突出顯示　231
12．5．2　JavaScript幻燈片　235
12．5．3　內(nèi)部導(dǎo)航　239
12．5．4　JavaScript圖片庫　242
12．5．5　增強(qiáng)表格　245
12．5．6　增強(qiáng)表單　249
12．5．7　壓縮代碼　263
12．6　小結(jié)　264

附錄　JavaScript庫　265