本書作為JavaScript+jQuery程序設(shè)計的教程, 系統(tǒng)全面地介紹了有關(guān)JavaScript+jQuery網(wǎng)站開發(fā)所涉及的各類知識。全書共分17章, 內(nèi)容包括JavaScript簡介、JavaScript語言基礎(chǔ)、JavaScript自定義對象、常用內(nèi)部對象、JavaScript事件處理、JavaScript常用文檔對象、文檔對象模型、Window對象、AJAX技術(shù)、jQuery簡介、jQuery選擇器、jQuery控制頁面、jQuery的事件處理、jQuery的動畫效果、React簡介、綜合開發(fā)實例--365影視網(wǎng)站設(shè)計、課程設(shè)計--購物車設(shè)計。全書每章內(nèi)容都與實例緊密結(jié)合, 有助于學(xué)生理解知識、應(yīng)用知識, 達到學(xué)以致用的目的。
《JavaScript+jQuery程序設(shè)計(慕課版)》是一本JavaScript程序設(shè)計互聯(lián)網(wǎng)教材,買書送名師,明日科技資深講師面對面授課。本課程依托人民郵電出版社自主開發(fā)的在線教育慕課平臺——人郵學(xué)院(www.rymooc.com),該平臺具有完備的在線“教、學(xué)、測”功能。人郵學(xué)院提供體系完整的100學(xué)時慕課教學(xué)視頻同步講解,即學(xué)即練的在線測試。書中附有188個微課視頻,掃一掃書中二維碼,便可隨時隨地學(xué)習(xí)。附贈300余道習(xí)題和自測題, PPT 課件、案例源代碼、自測試卷、拓展案例等豐富的配套資源。
第1章 JavaScript簡介 1
1.1 JavaScript簡述 2
1.1.1 JavaScript的起源 2
1.1.2 JavaScript的主要特點 2
1.1.3 JavaScript的應(yīng)用 3
1.2 編寫JavaScript的工具 4
1.3 JavaScript在HTML中的使用 5
1.3.1 在頁面中直接嵌入JavaScript代碼 5
實例:編寫第一個JavaScript程序
1.3.2 鏈接外部JavaScript文件 8
實例:調(diào)用外部JavaScript文件
1.3.3 作為標(biāo)簽的屬性值使用 10
1.4 JavaScript基本語法 10
1.4.1 執(zhí)行順序 10
1.4.2 大小寫敏感 10
1.4.3 空格與換行 11
1.4.4 每行結(jié)尾的分號 11
1.4.5 注釋 11
小結(jié) 11
上機指導(dǎo) 12
習(xí)題 12
第2章 JavaScript語言基礎(chǔ) 13
2.1 數(shù)據(jù)類型 14
2.1.1 數(shù)值型 14
實例:數(shù)字123不同進制的輸出結(jié)果
2.1.2 字符串型 16
實例:定義四個字符串并輸出
2.1.3 布爾型 17
2.1.4 特殊數(shù)據(jù)類型 18
2.2 常量和變量 18
2.2.1 常量 18
2.2.2 變量 18
實例:輸出兩個變量的值
2.3 運算符和表達式 20
2.3.1 什么是運算符和表達式 20
2.3.2 運算符的應(yīng)用 21
實例:應(yīng)用算術(shù)運算符對兩個變量進行運算
2.3.3 表達式中的類型轉(zhuǎn)換 29
實例:輸出表達式的結(jié)果
2.4 JavaScript基本語句 30
2.4.1 條件判斷語句 30
實例:獲取3個數(shù)中的最大值
2.4.2 循環(huán)控制語句 38
實例:計算100以內(nèi)所有奇數(shù)的和
2.4.3 跳轉(zhuǎn)語句 43
實例:計算1~100的所有5的倍數(shù)的和
2.4.4 異常處理語句 45
實例:使用try…catch…finally語句處理異常
2.5 函數(shù) 47
2.5.1 函數(shù)的定義 47
2.5.2 函數(shù)的調(diào)用 48
2.5.3 函數(shù)的參數(shù) 49
實例:函數(shù)參數(shù)的使用
2.5.4 函數(shù)的返回值 50
實例:函數(shù)返回值的簡單應(yīng)用
2.5.5 嵌套函數(shù) 51
實例:函數(shù)嵌套調(diào)用的應(yīng)用
2.5.6 遞歸函數(shù) 53
實例:遞歸函數(shù)的應(yīng)用
2.5.7 變量的作用域 54
2.5.8 內(nèi)置函數(shù) 55
2.5.9 定義函數(shù)的其他方法 60
實例:獲取從1到給定參數(shù)之間的所有3的倍數(shù)
小結(jié) 61
上機指導(dǎo) 61
習(xí)題 62
第3章 JavaScript自定義對象 63
3.1 對象簡介 64
3.1.1 什么是對象 64
3.1.2 對象的屬性和方法 64
3.1.3 JavaScript對象的種類 64
3.2 自定義對象的創(chuàng)建 65
3.2.1 直接創(chuàng)建自定義對象 65
3.2.2 通過自定義構(gòu)造函數(shù)創(chuàng)建對象 66
實例:創(chuàng)建一個球員對象Player
3.2.3 通過系統(tǒng)內(nèi)置的Object對象創(chuàng)建自定義對象 69
實例:創(chuàng)建一個圖書對象book
3.3 對象訪問語句 71
3.3.1 for…in循環(huán)語句 71
實例:輸出對象中的所有屬性和值
3.3.2 with語句 72
小結(jié) 73
上機指導(dǎo) 73
習(xí)題 74
第4章 常用內(nèi)部對象 75
4.1 Math對象 76
4.1.1 Math對象的屬性 76
實例:計算圓的周長和面積
4.1.2 Math對象的方法 76
實例:生成指定位數(shù)的隨機數(shù)
4.2 Number對象 78
4.2.1 創(chuàng)建Number對象 78
4.2.2 Number對象的屬性 79
4.2.3 Number對象的方法 80
4.3 Date對象 83
4.3.1 創(chuàng)建Date對象 83
4.3.2 Date對象的屬性 85
4.3.3 Date對象的方法 86
實例:輸出當(dāng)前的日期和時間
4.4 數(shù)組對象 89
4.4.1 數(shù)組介紹 89
4.4.2 定義數(shù)組 90
4.4.3 操作數(shù)組元素 91
實例:創(chuàng)建數(shù)組并輸出數(shù)組元素
4.4.4 數(shù)組的屬性 94
實例:在365影視網(wǎng)中循環(huán)輸出影片信息
4.4.5 數(shù)組的方法 97
實例:將數(shù)組中的元素順序顛倒后顯示
4.5 String對象 105
4.5.1 String對象的創(chuàng)建 105
4.5.2 String對象的屬性 105
實例:獲取字符串變量和字符串對象的長度
4.5.3 String對象的方法 107
實例:獲取指定字符在字符串中的出現(xiàn)次數(shù)
小結(jié) 116
上機指導(dǎo) 116
習(xí)題 118
第5章 JavaScript事件處理 119
5.1 事件與事件處理概述 120
5.1.1 什么是事件 120
5.1.2 JavaScript的常用事件 120
5.1.3 事件的調(diào)用 122
5.1.4 事件對象 123
5.2 表單相關(guān)事件 123
5.2.1 獲得焦點事件與失去焦點事件 123
實例:改變文本框的背景顏色
5.2.2 失去焦點內(nèi)容改變事件 125
實例:改變文本框的字體顏色
5.2.3 表單提交與重置事件 126
實例:判斷提交的表單中是否有空文本框
5.3 鼠標(biāo)鍵盤事件 128
5.3.1 鼠標(biāo)單擊事件 128
實例:動態(tài)改變頁面的背景顏色
5.3.2 鼠標(biāo)按下和松開事件 129
實例:按下鼠標(biāo)時改變字體顏色
5.3.3 鼠標(biāo)移入移出事件 130
實例:動態(tài)改變圖片的焦點
5.3.4 鼠標(biāo)移動事件 131
實例:在狀態(tài)欄中顯示當(dāng)前鼠標(biāo)的位置
5.3.5 鍵盤事件 131
實例:利用鍵盤中的A鍵對頁面進行刷新
5.4 頁面事件 134
5.4.1 加載與卸載事件 134
實例:網(wǎng)頁加載時縮小圖片
5.4.2 頁面大小事件 135
實例:鼠標(biāo)拖動瀏覽器邊框使其恢復(fù)原始大小
小結(jié) 136
上機指導(dǎo) 136
習(xí)題 137
第6章 JavaScript常用文檔對象 138
6.1 Document對象 139
6.1.1 文檔對象概述 139
6.1.2 文檔對象的常用屬性、方法與事件 139
6.1.3 Document對象的應(yīng)用 141
實例:設(shè)置超鏈接的文字顏色
6.1.4 JavaScript中的cookie設(shè)置 146
實例:將表單注冊信息寫入Cookie
6.2 表單對象 153
6.2.1 訪問表單與表單元素 153
6.2.2 表單對象的常用屬性、方法與
事件 154
6.2.3 表單對象的應(yīng)用 155
實例:驗證表單內(nèi)容是否為空
6.3 圖像對象 157
6.3.1 圖像對象概述 157
6.3.2 圖像對象的應(yīng)用 157
實例:圖片置頂
小結(jié) 163
上機指導(dǎo) 163
習(xí)題 165
第7章 文檔對象模型 166
7.1 DOM概述 167
7.1.1 DOM分層 167
7.1.2 DOM級別 168
7.2 DOM對象節(jié)點屬性 168
7.2.1 訪問指定節(jié)點 169
實例:訪問指定節(jié)點
7.2.2 遍歷文檔樹 170
實例:遍歷文檔樹
7.3 節(jié)點 173
7.3.1 創(chuàng)建節(jié)點 173
實例:創(chuàng)建新的節(jié)點
7.3.2 插入節(jié)點 175
實例:插入節(jié)點
7.3.3 復(fù)制節(jié)點 176
實例:復(fù)制節(jié)點
7.3.4 刪除與替換節(jié)點 178
實例:刪除節(jié)點
7.4 獲取文檔中的指定元素 180
7.4.1 通過元素的ID屬性獲取元素 180
實例:在365影視網(wǎng)中實現(xiàn)導(dǎo)航菜單功能
7.4.2 通過元素的name屬性獲取元素 183
實例:在365影視網(wǎng)中實現(xiàn)電影圖片輪換效果
7.5 與DHTML相對應(yīng)的DOM 184
7.5.1 innerHTML和innerText屬性 184
7.5.2 outerHTML和outerText屬性 185
實例:顯示分時問候
小結(jié) 187
上機指導(dǎo) 187
習(xí)題 188
第8章 Window對象 189
8.1 Window對象概述 190
8.1.1 Window對象的屬性 190
8.1.2 Window對象的方法 190
8.1.3 Window對象的使用 191
8.2 對話框 191
8.2.1 警告對話框 191
實例:彈出警告對話框
8.2.2 確認對話框 192
實例:彈出確認對話框
8.2.3 提示對話框 193
實例:彈出提示對話框并返回相應(yīng)數(shù)據(jù)
8.3 打開與關(guān)閉窗口 193
8.3.1 打開窗口 194
實例:在365影視網(wǎng)中實現(xiàn)在新窗口中打開影片詳情頁面
8.3.2 關(guān)閉窗口 196
實例:關(guān)閉子窗口同時刷新父窗口
8.4 控制窗口 198
8.4.1 移動窗口 198
實例:實現(xiàn)窗口的反彈效果
8.4.2 窗口滾動 200
實例:頁面自動滾動
8.4.3 改變窗口大小 202
實例:彈出自動改變大小的窗口
8.4.4 控制窗口狀態(tài)欄 203
實例:狀態(tài)欄中文字從右向左依次彈出的效果
8.4.5 訪問窗口歷史 205
8.4.6 設(shè)置超時 206
8.5 窗口事件 206
8.5.1 通用窗口事件 206
8.5.2 擴展窗口事件 206
小結(jié) 207
上機指導(dǎo) 207
習(xí)題 208
第9章 AJAX技術(shù) 209
9.1 AJAX概述 210
9.1.1 什么是AJAX 210
9.1.2 AJAX應(yīng)用案例 210
9.1.3 AJAX的開發(fā)模式 211
9.1.4 AJAX的優(yōu)點 212
9.2 AJAX的技術(shù)組成 213
9.2.1 XMLHttpRequest對象 213
9.2.2 XML語言 213
9.2.3 JavaScript腳本語言 215
9.2.4 DOM 215
9.2.5 CSS 215
9.3 XMLHttpRequest對象 215
9.3.1 XMLHttpRequest對象的初始化 216
9.3.2 XMLHttpRequest對象的常用屬性 216
9.3.3 XMLHttpRequest對象的常用方法 218
實例:讀取HTML文件并輸出結(jié)果
小結(jié) 221
上機指導(dǎo) 221
習(xí)題 222
第10章 jQuery簡介 223
10.1 jQuery概述 224
10.1.1 jQuery能做什么 224
10.1.2 jQuery的特點 225
10.2 jQuery下載與配置 226
10.2.1 下載jQuery 226
10.2.2 配置jQuery 227
10.3 jQuery的插件 227
10.3.1 插件的使用 227
10.3.2 流行的插件 228
小結(jié) 230
習(xí)題 230
第11章 jQuery選擇器 231
11.1 jQuery的工廠函數(shù) 232
11.2 基本選擇器 232
11.2.1 ID選擇器 232
實例:獲取文本框中輸入的值
11.2.2 元素選擇器 233
實例:單擊按鈕修改元素內(nèi)容
11.2.3 類名選擇器 235
實例:設(shè)置元素的CSS樣式
11.2.4 復(fù)合選擇器 236
實例:為元素添加新的樣式
11.2.5 通配符選擇器 237
11.3 層級選擇器 237
11.3.1 ancestor descendan選擇器 238
實例:為版權(quán)列表設(shè)置樣式
11.3.2 parent > child選擇器 239
實例:獲取表單中文本框的值
11.3.3 prev + next選擇器 240
實例:改變匹配元素的背景顏色
11.3.4 prev ~ siblings選擇器 241
實例:篩選頁面中div元素的同輩元素
11.4 過濾選擇器 242
11.4.1 簡單過濾器 242
實例:實現(xiàn)一個帶表頭的雙色表格
11.4.2 內(nèi)容過濾器 245
實例:應(yīng)用內(nèi)容過濾器匹配單元格
11.4.3 可見性過濾器 247
實例:獲取隱藏和顯示的input元素的值
11.4.4 表單對象的屬性過濾器 247
實例:匹配表單中相應(yīng)的元素
11.4.5 子元素選擇器 249
11.5 屬性選擇器 249
11.6 表單選擇器 250
實例:匹配表單中相應(yīng)元素并實現(xiàn)不同的操作
小結(jié) 251
上機指導(dǎo) 252
習(xí)題 253
第12章 jQuery控制頁面 254
12.1 對元素內(nèi)容和值進行操作 255
12.1.1 對元素內(nèi)容操作 255
實例:獲取和設(shè)置元素的文本內(nèi)容與HTML內(nèi)容
12.1.2 對元素值操作 257
實例:為多行列表框設(shè)置并獲取值
12.2 對DOM節(jié)點進行操作 258
12.2.1 查找節(jié)點 259
12.2.2 創(chuàng)建節(jié)點 259
12.2.3 插入節(jié)點 259
12.2.4 刪除、復(fù)制與替換節(jié)點 260
實例:實現(xiàn)我的開心小農(nóng)場
12.3 對元素屬性進行操作 264
實例:復(fù)選框的全選、反選與全不選
12.4 對元素的CSS樣式操作 268
12.4.1 通過修改CSS類實現(xiàn)樣式操作 268
實例:修改表單元素的CSS樣式
12.4.2 通過修改CSS屬性實現(xiàn)樣式操作 270
實例:生成一個可以編輯的表格
小結(jié) 272
上機指導(dǎo) 272
習(xí)題 275
第13章 jQuery的事件處理 276
13.1 頁面加載響應(yīng)事件 277
13.2 jQuery中的事件 277
實例:實現(xiàn)橫向?qū)Ш讲藛喂δ?br />
13.3 事件綁定 281
13.3.1 為元素綁定事件 281
實例:實現(xiàn)表格的動態(tài)換膚
13.3.2 移除綁定 282
13.3.3 綁定一次性事件處理 282
13.4 模擬用戶操作 283
13.4.1 模擬用戶的操作觸發(fā)事件 283
實例:自動執(zhí)行按鈕的click事件
13.4.2 模仿懸停事件 284
實例:鼠標(biāo)指向圖片時為圖片加邊框
13.4.3 模擬鼠標(biāo)連續(xù)單擊事件 284
實例:實現(xiàn)圖片的放大與縮小
小結(jié) 286
上機指導(dǎo) 286
習(xí)題 289
第14章 jQuery的動畫效果 290
14.1 基本的動畫效果 291
14.1.1 隱藏匹配元素 291
14.1.2 顯示匹配元素 291
實例:自動隱藏式菜單
14.1.3 切換元素的可見狀態(tài) 293
實例:全部資源與精簡資源的切換
14.2 淡入淡出的動畫效果 296
實例:具有淡入淡出動畫效果的自動隱藏式菜單
14.3 滑動效果 297
14.3.1 滑動顯示匹配的元素 297
14.3.2 滑動隱藏匹配的元素 298
實例:伸縮式導(dǎo)航菜單
14.3.3 通過高度的變化動態(tài)切換元素的可見性 300
14.4 自定義的動畫效果 301
14.4.1 使用animate()方法創(chuàng)建自定義動畫 301
實例:在365影視網(wǎng)中實現(xiàn)即將上線影片信息向上滾動的效果
14.4.2 使用stop()方法停止動畫 303
小結(jié) 304
上機指導(dǎo) 304
習(xí)題 306
第15章 React簡介 307
15.1 React概述 308
15.1.1 什么是React 308
15.1.2 React的常用術(shù)語 308
15.2 創(chuàng)建React元素 309
15.2.1 安裝React 309
15.2.2 使用JavaScript創(chuàng)建React元素 309
15.2.3 使用JSX創(chuàng)建React元素 310
實例:在模板中定義一個數(shù)組并輸出
15.3 創(chuàng)建組件 312
15.3.1 創(chuàng)建無狀態(tài)React組件 312
15.3.2 創(chuàng)建有狀態(tài)React組件 313
實例:控制按鈕可用狀態(tài)
小結(jié) 315
上機指導(dǎo) 315
習(xí)題 316
第16章 綜合開發(fā)實例——365影視網(wǎng)站設(shè)計 317
16.1 系統(tǒng)分析 318
16.2 系統(tǒng)設(shè)計 318
16.2.1 系統(tǒng)目標(biāo) 318
16.2.2 系統(tǒng)功能結(jié)構(gòu) 318
16.2.3 開發(fā)環(huán)境 319
16.2.4 文件夾組織結(jié)構(gòu) 320
16.3 網(wǎng)頁預(yù)覽 320
16.4 關(guān)鍵技術(shù) 322
16.4.1 JavaScript腳本技術(shù) 322
16.4.2 AJAX無刷新技術(shù) 324
16.4.3 jQuery技術(shù) 328
16.5 首頁技術(shù)實現(xiàn) 329
16.5.1 JavaScript實現(xiàn)導(dǎo)航菜單 329
16.5.2 JavaScript實現(xiàn)圖片的輪換效果 332
16.5.3 AJAX實現(xiàn)熱門專題頁面 333
16.5.4 JavaScript實現(xiàn)電影圖片不間斷滾動 335
16.5.5 JavaScript實現(xiàn)浮動窗口 336
16.5.6 jQuery實現(xiàn)滑動門效果 338
16.5.7 jQuery實現(xiàn)向上間斷滾動效果 340
16.6 查看影片詳情頁面 342
小結(jié) 343
第17章 課程設(shè)計——購物車設(shè)計 344
17.1 購物車概述 345
17.1.1 功能概述 345
17.1.2 購物車操作流程 345
17.1.3 程序預(yù)覽 346
17.2 系統(tǒng)設(shè)計 347
17.2.1 系統(tǒng)目標(biāo) 347
17.2.2 開發(fā)環(huán)境 347
17.2.3 文件夾組織結(jié)構(gòu) 347
17.3 熱點關(guān)鍵技術(shù) 348
17.3.1 JavaScript中的cookie 348
17.3.2 應(yīng)用AJAX技術(shù)實現(xiàn)用戶登錄 348
17.3.3 判斷用戶訪問權(quán)限 349
17.4 用戶登錄設(shè)計 349
17.4.1 用戶登錄功能概述 349
17.4.2 自動生成驗證碼 350
17.4.3 用戶登錄功能的實現(xiàn) 350
17.5 購物車操作 352
17.5.1 添加至購物車 352
17.5.2 查看購物車 355
17.5.3 修改商品購買數(shù)量 356
17.5.4 移除購物車中指定商品 357
17.5.5 清空購物車 359
小結(jié) 360