第1篇 基礎(chǔ)知識
第1章 初識JavaScript 2
視頻講解：45分鐘
1.1 JavaScript簡述 2
1.1.1 JavaScript的起源 3
1.1.2 JavaScript的主要特點(diǎn) 3
1.1.3 JavaScript的應(yīng)用 4
1.2 WebStorm的下載與安裝 6
1.2.1 WebStorm的下載 6
1.2.2 WebStorm的安裝 7
1.3 JavaScript在HTML中的應(yīng)用 10
1.3.1 在頁面中直接嵌入JavaScript代碼 10
1.3.2 鏈接外部JavaScript文件 14
1.3.3 作為標(biāo)簽的屬性值使用 16
1.4 JavaScript基本語法 16
1.4.1 執(zhí)行順序 16
1.4.2 字母大小寫 17
1.4.3 空格與換行 17
1.4.4 每行結(jié)尾的分號 17
1.4.5 注釋 17
1.5 實(shí)踐與練習(xí) 18
第2章 JavaScript基礎(chǔ) 19
視頻講解：133分鐘
2.1 數(shù)據(jù)類型 19
2.1.1 數(shù)值型 19
2.1.2 字符串型 22
2.1.3 布爾型 24
2.1.4 特殊數(shù)據(jù)類型 25
2.2 常量和變量 25
2.2.1 常量 25
2.2.2 變量 25
2.3 運(yùn)算符 28
2.3.1 算術(shù)運(yùn)算符 28
2.3.2 字符串運(yùn)算符 29
2.3.3 比較運(yùn)算符 31
2.3.4 賦值運(yùn)算符 32
2.3.5 邏輯運(yùn)算符 33
2.3.6 條件運(yùn)算符 33
2.3.7 其他運(yùn)算符 34
2.3.8 運(yùn)算符的優(yōu)先級與結(jié)合性 35
2.4 表達(dá)式 37
2.5 數(shù)據(jù)類型的轉(zhuǎn)換規(guī)則 37
2.6 實(shí)踐與練習(xí) 39
第3章 流程控制語句 40
視頻講解：102分鐘
3.1 條件判斷語句 40
3.1.1 簡單if語句 40
3.1.2 if…else語句 42
3.1.3 if…else if語句 43
3.1.4 if語句的嵌套 44
3.1.5 switch語句 46
3.2 循環(huán)控制語句 48
3.2.1 while循環(huán)語句 48
3.2.2 do…while循環(huán)語句 49
3.2.3 for循環(huán)語句 50
3.2.4 循環(huán)語句的嵌套 52
3.3 跳轉(zhuǎn)語句 53
3.3.1 continue語句 53
3.3.2 break語句 55
3.4 實(shí)踐與練習(xí) 55
第4章 函數(shù) 57
視頻講解：59分鐘
4.1 函數(shù)的定義 57
4.2 函數(shù)的調(diào)用 58
4.2.1 函數(shù)的簡單調(diào)用 58
4.2.2 在事件響應(yīng)中調(diào)用函數(shù) 59
4.2.3 通過超鏈接調(diào)用函數(shù) 60
4.3 函數(shù)的參數(shù) 60
4.4 函數(shù)的返回值 61
4.5 函數(shù)的嵌套調(diào)用 62
4.6 遞歸函數(shù) 63
4.7 JavaScript中的內(nèi)置函數(shù) 64
4.7.1 數(shù)值處理函數(shù) 65
4.7.2 字符串處理函數(shù) 66
4.8 匿名函數(shù) 67
4.8.1 在表達(dá)式中定義匿名函數(shù) 68
4.8.2 使用Function()構(gòu)造函數(shù)定義匿名函數(shù) 69
4.9 實(shí)踐與練習(xí) 70
第5章 對象 71
視頻講解：58分鐘
5.1 對象簡介 71
5.1.1 對象的概念 71
5.1.2 對象的創(chuàng)建 72
5.2 操作對象 72
5.2.1 訪問屬性 72
5.2.2 添加屬性 73
5.2.3 刪除屬性 73
5.2.4 添加方法 73
5.2.5 遍歷對象 74
5.3 JavaScript內(nèi)部對象 75
5.3.1 Math對象 75
5.3.2 Date對象 77
5.3.3 Event對象 82
5.4 實(shí)踐與練習(xí) 89
第6章 數(shù)組與集合 91
視頻講解：109分鐘
6.1 數(shù)組 91
6.1.1 定義數(shù)組 91
6.1.2 數(shù)組元素的輸入和輸出 93
6.1.3 稀疏數(shù)組 95
6.1.4 獲取數(shù)組的長度 95
6.1.5 數(shù)組對象的方法 96
6.1.6 數(shù)組的添加和刪除 97
6.1.7 設(shè)置數(shù)組的排列順序 99
6.1.8 獲取數(shù)組中的某段數(shù)組元素 102
6.1.9 將數(shù)組轉(zhuǎn)換成字符串 103
6.2 Map集合 105
6.2.1 創(chuàng)建Map 105
6.2.2 Map操作方法 105
6.2.3 Map集合的遍歷 108
6.3 Set集合 110
6.3.1 創(chuàng)建Set 110
6.3.2 Set操作方法 110
6.3.3 Set集合的遍歷 112
6.4 迭代器 113
6.4.1 迭代器的原理 114
6.4.2 迭代器的簡單應(yīng)用 114
6.4.3 提前終止迭代器 115
6.5 實(shí)踐與練習(xí) 116
第7章 String對象 117
視頻講解：64分鐘
7.1 String對象的創(chuàng)建 117
7.2 String對象的屬性 118
7.2.1 length屬性 118
7.2.2 constructor屬性 119
7.2.3 prototype屬性 120
7.3 String對象的方法 120
7.3.1 查找字符串 120
7.3.2 截取字符串 122
7.3.3 字符串的大小寫轉(zhuǎn)換 124
7.3.4 連接和拆分字符串 125
7.3.5 格式化字符串 127
7.4 實(shí)踐與練習(xí) 128
第8章 正則表達(dá)式 129
視頻講解：83分鐘
8.1 正則表達(dá)式基礎(chǔ) 129
8.1.1 正則表達(dá)式的基本結(jié)構(gòu) 130
8.1.2 正則表達(dá)式的作用 130
8.2 正則表達(dá)式語法 130
8.2.1 模式匹配符 130
8.2.2 定位符與原義字符 132
8.2.3 限定符與選擇匹配符 135
8.2.4 字符匹配符 136
8.2.5 分組組合與反向引用符 138
8.2.6 實(shí)際應(yīng)用 139
8.3 RegExp對象 140
8.3.1 創(chuàng)建RegExp對象 140
8.3.2 RegExp對象的屬性 142
8.3.3 RegExp對象的方法 143
8.4 String對象中的模式匹配方法 144
8.4.1 match()方法 144
8.4.2 search()方法 145
8.4.3 replace()方法 146
8.4.4 split()方法 147
8.5 實(shí)踐與練習(xí) 147
第9章 異常處理與程序調(diào)試 149
視頻講解：41分鐘
9.1 異常處理 149
9.1.1 異常類型 149
9.1.2 觸發(fā)onerror事件處理異常 150
9.1.3 使用try...catch…finally語句處理異常 151
9.2 程序調(diào)試 155
9.2.1 使用alert()語句調(diào)試 155
9.2.2 使用write()語句調(diào)試 156
9.2.3 使用拋出自定義異常消息調(diào)試 156
9.3 實(shí)踐與練習(xí) 157
第10章 JavaScript高級編程 159
視頻講解：43分鐘
10.1 構(gòu)造函數(shù)和原型 159
10.1.1 構(gòu)造函數(shù) 160
10.1.2 原型對象prototype 160
10.1.3 constructor屬性 161
10.1.4 擴(kuò)展內(nèi)部對象 161
10.2 類和對象 162
10.2.1 創(chuàng)建類和實(shí)例 162
10.2.2 類的構(gòu)造函數(shù) 162
10.2.3 在類中添加方法 163
10.2.4 類的繼承 164
10.2.5 靜態(tài)成員 165
10.3 模塊 166
10.3.1 模塊概述 166
10.3.2 ECMAScript 6中的模塊 166
10.4 實(shí)踐與練習(xí) 170
第2篇 核心技術(shù)
第11章 事件處理 172
視頻講解：68分鐘
11.1 事件與事件處理概述 172
11.1.1 事件與事件名稱 172
11.1.2 JavaScript的常用事件 173
11.1.3 事件處理程序的調(diào)用 175
11.2 DOM事件模型 176
11.2.1 DOM事件模型的種類 176
11.2.2 注冊與移除事件監(jiān)聽器 176
11.3 鼠標(biāo)和鍵盤事件 177
11.3.1 鼠標(biāo)的單擊事件 177
11.3.2 鼠標(biāo)的按下和松開事件 178
11.3.3 鼠標(biāo)的移入和移出事件 179
11.3.4 鼠標(biāo)的移動事件 180
11.3.5 鍵盤事件 180
11.4 頁面相關(guān)事件 183
11.4.1 onload事件 184
11.4.2 onresize事件 185
11.5 表單相關(guān)事件 185
11.5.1 獲得焦點(diǎn)與失去焦點(diǎn)事件 186
11.5.2 失去焦點(diǎn)修改事件 186
11.5.3 表單提交與重置事件 187
11.6 編輯事件 189
11.6.1 文本編輯事件 189
11.6.2 對象拖放事件 192
11.7 實(shí)踐與練習(xí) 194
第12章 Document對象 195
視頻講解：46分鐘
12.1 Document對象概述 195
12.2 Document對象的常用屬性和方法 196
12.2.1 常用屬性 196
12.2.2 常用方法 196
12.3 Document對象的應(yīng)用 197
12.3.1 設(shè)置文檔背景色和前景色 197
12.3.2 設(shè)置動態(tài)標(biāo)題欄 198
12.3.3 獲取URL 199
12.3.4 獲取當(dāng)前文檔的狀態(tài) 199
12.3.5 在文檔中輸出數(shù)據(jù) 200
12.3.6 打開新文檔并輸出內(nèi)容 201
12.3.7 動態(tài)添加HTML標(biāo)記 202
12.3.8 獲取文本框并修改其內(nèi)容 203
12.4 實(shí)踐與練習(xí) 204
第13章 文檔對象模型 205
視頻講解：40分鐘
13.1 DOM概述 205
13.2 DOM節(jié)點(diǎn)屬性 207
13.2.1 訪問指定節(jié)點(diǎn) 207
13.2.2 遍歷文檔樹 208
13.3 節(jié)點(diǎn) 211
13.3.1 創(chuàng)建節(jié)點(diǎn) 211
13.3.2 插入節(jié)點(diǎn) 212
13.3.3 復(fù)制節(jié)點(diǎn) 213
13.3.4 刪除與替換節(jié)點(diǎn) 214
13.4 獲取文檔中的指定元素 216
13.4.1 通過元素的id屬性獲取元素 216
13.4.2 通過元素的class屬性獲取元素 217
13.5 與DHTML相對應(yīng)的DOM 219
13.5.1 innerHTML和innerText屬性 219
13.5.2 outerHTML和outerText屬性 221
13.6 實(shí)踐與練習(xí) 221
第14章 Window對象 223
視頻講解：39分鐘
14.1 Window對象簡介 223
14.1.1 屬性 223
14.1.2 方法 224
14.1.3 使用 225
14.2 對話框 225
14.2.1 警告對話框 225
14.2.2 確認(rèn)對話框 226
14.2.3 提示對話框 227
14.3 窗口的打開與關(guān)閉 228
14.3.1 打開窗口 228
14.3.2 關(guān)閉窗口 230
14.4 控制窗口 231
14.4.1 移動窗口 232
14.4.2 窗口滾動 232
14.4.3 設(shè)置超時 234
14.5 窗口事件 235
14.6 實(shí)踐與練習(xí) 235
第15章 瀏覽器對象模型 237
視頻講解：16分鐘
15.1 location對象 237
15.1.1 location對象的屬性 237
15.1.2 location對象的方法 238
15.2 navigator對象 240
15.3 screen對象 241
15.4 history對象 242
15.4.1 history對象的屬性 242
15.4.2 history對象的方法 242
15.5 實(shí)踐與練習(xí) 243
第16章 Style對象 244
視頻講解：29分鐘
16.1 Style對象簡介 244
16.2 樣式標(biāo)簽屬性和樣式屬性 245
16.3 常用樣式屬性操作 247
16.3.1 顏色和背景屬性 247
16.3.2 邊框?qū)傩?250
16.3.3 定位屬性 253
16.3.4 字體屬性 258
16.3.5 表格布局屬性 261
16.4 實(shí)踐與練習(xí) 262
第17章 Form對象 264
視頻講解：44分鐘
17.1 訪問表單與表單元素的方法 264
17.1.1 JavaScript訪問表單 264
17.1.2 JavaScript訪問表單元素 265
17.2 Form對象的屬性、方法與事件 265
17.3 Form對象的應(yīng)用 266
17.3.1 文本框 266
17.3.2 按鈕 268
17.3.3 單選按鈕和復(fù)選框 270
17.3.4 下拉菜單 272
17.4 實(shí)踐與練習(xí) 275
第3篇 高級應(yīng)用
第18章 圖像處理 278
視頻講解：62分鐘
18.1 圖像對象概述 278
18.2 圖像對象的應(yīng)用 279
18.2.1 圖像的預(yù)裝載 279
18.2.2 圖像的隨機(jī)顯示 281
18.2.3 無間斷的圖像滾動效果 282
18.2.4 登錄圖像驗(yàn)證碼 284
18.2.5 浮動廣告 284
18.2.6 圖像漸變效果 286
18.2.7 進(jìn)度條的顯示 287
18.2.8 圖像的時鐘顯示 288
18.2.9 不斷閃爍的圖像 289
18.2.10 圖像總是置于頂端 290
18.3 實(shí)踐與練習(xí) 291
第19章 JavaScript中的XML 294
視頻講解：37分鐘
19.1 XML簡介 294
19.2 XML文檔 294
19.3 DOM與XML 295
19.4 解析XML 297
19.5 讀取XML 298
19.5.1 獲取指定XML元素的屬性值 298
19.5.2 通過DOM元素的方法獲取XML元素中的數(shù)據(jù) 300
19.5.3 在表格中讀取XML數(shù)據(jù) 301
19.5.4 通過JavaScript操作XML實(shí)現(xiàn)分頁 302
19.6 實(shí)踐與練習(xí) 305
第20章 JSON 307
視頻講解：30分鐘
20.1 JSON簡介 307
20.1.1 什么是JSON 307
20.1.2 JSON語法規(guī)則 307
20.2 JSON對象 308
20.2.1 獲取值 308
20.2.2 遍歷JSON對象 309
20.2.3 嵌套JSON對象 309
20.3 JSON數(shù)組 310
20.3.1 獲取值 310
20.3.2 遍歷JSON數(shù)組 310
20.3.3 JSON對象中的嵌套數(shù)組 311
20.4 JSON和JavaScript對象的轉(zhuǎn)換 313
20.4.1 JSON序列化 313
20.4.2 JSON反序列化 313
20.5 實(shí)踐與練習(xí) 314
第21章 JavaScript的安全 315
視頻講解：23分鐘
21.1 同源策略 315
21.2 JavaScript代碼安全 316
21.2.1 屏蔽部分按鍵 317
21.2.2 屏蔽鼠標(biāo)右鍵 318
21.2.3 禁止復(fù)制網(wǎng)頁內(nèi)容 319
21.3 實(shí)踐與練習(xí) 320
第22章 Ajax技術(shù) 321
視頻講解：33分鐘
22.1 Ajax概述 321
22.1.1 Ajax應(yīng)用案例 321
22.1.2 Ajax的開發(fā)模式 322
22.1.3 Ajax的優(yōu)缺點(diǎn) 323
22.2 Ajax的技術(shù)組成 324
22.3 XMLHttpRequest對象 325
22.3.1 XMLHttpRequest對象的初始化 325
22.3.2 XMLHttpRequest對象的常用屬性 325
22.3.3 XMLHttpRequest對象的常用方法 327
22.4 實(shí)踐與練習(xí) 331
第23章 Vue.js編程 332
視頻講解：64分鐘
23.1 Vue.js簡介 332
23.2 Vue.js的安裝 333
23.2.1 使用CDN 333
23.2.2 使用NPM 333
23.2.3 使用Vue CLI 334
23.3 應(yīng)用程序?qū)嵗斑x項(xiàng) 334
23.3.1 數(shù)據(jù) 334
23.3.2 方法 335
23.3.3 生命周期鉤子函數(shù) 335
23.4 數(shù)據(jù)綁定 337
23.4.1 文本插值 337
23.4.2 插入HTML 338
23.4.3 使用表達(dá)式 338
23.5 指令 339
23.5.1 v-bind指令 339
23.5.2 v-on指令 340
23.5.3 v-if和v-else指令 341
23.5.4 v-show指令 342
23.5.5 v-for指令 343
23.5.6 v-model指令 348
23.6 計(jì)算屬性 350
23.6.1 計(jì)算屬性簡介 351
23.6.2 getter和setter 352
23.6.3 計(jì)算屬性緩存 354
23.7 實(shí)踐與練習(xí) 356
第4篇 項(xiàng)目實(shí)戰(zhàn)
第24章 星光電影網(wǎng) 358
視頻講解：8分鐘
24.1 系統(tǒng)分析 358
24.2 系統(tǒng)設(shè)計(jì) 359
24.2.1 系統(tǒng)目標(biāo) 359
24.2.2 系統(tǒng)功能結(jié)構(gòu) 359
24.2.3 系統(tǒng)業(yè)務(wù)流程 359
24.2.4 網(wǎng)頁預(yù)覽 360
24.3 系統(tǒng)開發(fā)  362
24.3.1 開發(fā)環(huán)境 362
24.3.2 文件夾組織結(jié)構(gòu) 364
24.4 關(guān)鍵技術(shù) 365
24.4.1 JavaScript腳本技術(shù) 365
24.4.2 Ajax請求 366
24.4.3 Vue.js技術(shù) 367
24.5 首頁技術(shù)實(shí)現(xiàn) 368
24.5.1 JavaScript實(shí)現(xiàn)導(dǎo)航菜單 368
24.5.2 JavaScript實(shí)現(xiàn)圖片的輪換效果 370
24.5.3 Ajax實(shí)現(xiàn)熱門專題頁面 371
24.5.4 Vue.js實(shí)現(xiàn)電影圖片不間斷滾動 372
24.5.5 JavaScript實(shí)現(xiàn)浮動窗口 374
24.5.6 JavaScript實(shí)現(xiàn)滑動門效果 376
24.5.7 JavaScript實(shí)現(xiàn)向上間斷滾動效果 378
24.6 影片詳情頁面的實(shí)現(xiàn) 380