JavaScript實戰—JavaScript,jQuery,HTML5,Node.js實例大全

JavaScript實戰—JavaScript,jQuery,HTML5,Node.js實例大全

《JavaScript實戰—JavaScript,jQuery,HTML5,Node.js實例大全》是2014年8月1日清華大學出版社出版的圖書,作者是張澤娜。

基本介紹

  • 中文名:JavaScript實戰—JavaScript,jQuery,HTML5,Node.js實例大全
  • 作者:張澤娜
  • 出版時間:2014年8月1日
  • 出版社清華大學出版社
  • ISBN:9787302369936
  • 定價:69 元
內容簡介,圖書目錄,

內容簡介

本書從實際的套用場景出發,結合當下熱門技術(AJAX、jQueryUI、瀑布流、HTML5、Node.js、CSS3、CSShack),用最淺顯的例子帶領大家走向IT前沿。本書分為5篇共24章。第一篇介紹JavaScript的基礎知識,用原生的JavaScript做表單驗證、照片展示、抽象樹控制項等;第二篇認識HTML5的熱門特性,如新表單驗證、CSS3動畫、離線API及多媒體;第三篇學習強大的Canvas,它是網頁遊戲的基礎;第四篇學習用jQueryUI進行實戰開發;第五篇通過Node.js了解JavaScript強大的後端開發功能。

圖書目錄

第一篇JavaScript實戰篇
第1章JavaScript概述 3
1.1認識JavaScript 3
1.1.1瀏覽器戰爭 3
1.1.2寄生語言 5
1.1.3DHTML、DOM和W3C 5
1.1.4動態語言和靜態語言 6
1.2配置JavaScript開發環境 7
1.2.1EditPlus 7
1.2.2AdobeDreamweaver 8
1.2.3SublimeText 8
1.2.4JetBrainsWebStorm 9
1.2.5AptanaStudio 10
1.3在Web頁面中使用JavaScript 11
1.3.1直接內嵌JavaScript代碼 12
1.3.2引用JavaScript檔案 12
1.3.3讓收藏夾做更多事情 13
1.4高效率的開發 14
1.4.1熟悉語法 14
1.4.2自動完成 15
1.4.3使用成熟框架和便捷工具 17
1.5相關參考 17
第2章用JavaScript驗證表單 18
2.1最簡單的表單驗證——禁止空白的必填項目 18
2.1.1最簡單表單的HTML結構 19
2.1.2綁定驗證功能 19
2.1.3綁定驗證的另一種方式 21
2.2處理各種類型的表單元素 23
2.2.1input、textarea、hidden和button 23
2.2.2checkbox、radio和select 26
2.3用正則來校驗複雜的格式要求 30
2.3.1認識JavaScript正則 30
2.3.2JavaScript正則符號及其說明 30
2.3.3正則驗證輸入信箱 33
2.4改善用戶體驗 33
2.4.1什麼是用戶體驗 34
2.4.2表單的用戶體驗改善 35
2.5相關參考 40
第3章用JavaScript實現照片展示 41
3.1功能設計 41
3.1.1HTML、CSS和JavaScript的分層關係 42
3.1.2照片展示功能設計 42
3.2照片載入與定位 43
3.2.1HTML代碼 43
3.2.2CSS代碼 43
3.2.3JavaScript代碼 46
3.3回響滑鼠動作 48
3.3.1回響小照片單擊動作 48
3.3.2回響小照片上一組或下一組單擊動作 49
3.4回響鍵盤動作 49
3.4.1常見鍵盤按鍵對應的ASCII碼值 49
3.4.2回響鍵盤動作 50
3.5代碼分離帶來的紅利 51
3.6相關參考 52
第4章AJAX——無刷新的用戶體驗 53
4.1認識AJAX 53
4.1.1AJAX是技術不是程式語言 53
4.1.2同步與異步 54
4.1.3AJAX與JSON 55
4.1.4AJAX是如何工作的 56
4.2XMLHttpRequest對象的常見方法和屬性 58
4.2.1XMLHttpRequest對象方法 58
4.2.2XMLHttpRequest對象屬性 60
4.3檢查待註冊的用戶名是否存在 63
4.3.1客戶端進行檢測 63
4.3.2伺服器端獲取數據 64
4.4用Ajax提交數據給伺服器 65
4.4.1客戶端部分 65
4.4.2服務端部分 67
4.5相關參考 68
第5章瀑布流布局 69
5.1瀑布流簡介 69
5.1.1瀑布流是不是萬金油 69
5.1.2穿過瀑布流看水簾洞 70
5.2固定列寬的簡單瀑布流實現 72
5.2.1簡單的HTML結構 72
5.2.2讓瀑布流動起來 74
5.3非固定列寬的複雜瀑布流 76
5.3.1非固定列寬瀑布流的爭議 76
5.3.2用Masonry實現任意非固定列寬瀑布流 77
5.4延遲載入圖片 79
5.4.1延遲載入是何方神聖 79
5.4.2延遲載入運用實例 80
5.5相關參考 83
第6章用戶控制項的構造——目錄樹視圖 84
6.1功能設計 84
6.2樹視圖的最簡化實現 85
6.2.1樹視圖的HTML結構和數據結構 85
6.2.2用遞歸最簡化顯示樹 86
6.3類和抽象 88
6.3.1基於對象(Object-Based)和面向對象(Object-Oriented) 89
6.3.2用JavaScript創建一個類 89
6.3.3靜態屬性、方法和動態屬性、方法 90
6.3.4JavaScript繼承 91
6.3.5私有屬性和方法 92
6.3.6抽象 92
6.4複雜的樹視圖 93
6.4.1閉包隔離變數污染 93
6.4.2省去new關鍵字調用控制項 93
6.4.3豐富控制項方法 93
6.5相關參考 100
第二篇HTML5+CSS3實戰篇
第7章HTML5概述 103
7.1什麼是HTML5 103
7.1.1差點夭折的HTML5 103
7.1.2HTML5的前世今生 104
7.1.3HTML5理念 106
7.2HTML5的新特性 106
7.2.1語義化 106
7.2.2CSS3 107
7.2.3本地存儲/離線套用 107
7.2.4音頻/視頻多媒體 109
7.2.5畫布Canvas 109
7.2.6本地檔案訪問 109
7.2.7開放字型格式WOFF 109
7.2.8地理位置 109
7.2.9微數據 110
7.2.10XMLHttpRequestLevel2 110
7.2.11新的HTMLForms 111
7.2.12其他特性及未來發展 111
7.3有哪些瀏覽器支持HTML5 112
7.4如何書寫HTML5 113
7.4.1HTML5和XHTML的對比 113
7.4.2HTML5書寫的誤區 114
7.5相關參考 115
第8章煥然一新的表單 116
8.1E-mail和URL類型的輸入元素 116
8.1.1各瀏覽器核心一覽 116
8.1.2各瀏覽器對E-mail和URL類型的支持情況 118
8.1.3全球頂級域名 119
8.1.4E-mail類型的使用 121
8.1.5URL類型的使用 122
8.2數值輸入 122
8.2.1各瀏覽器對number類型的支持情況 123
8.2.2number類型的屬性與使用 123
8.3日期選擇器 124
8.3.1各瀏覽器對日期選擇器的支持情況 124
8.3.2日期選擇器類型與使用 124
8.4用datalist來實現自動提示 126
8.4.1各瀏覽器對datalist的支持情況 126
8.4.2各瀏覽器datalist的效果對比 126
8.4.3datalist讓input自動提示更智慧型 127
8.5相關參考 128
第9章在Web頁面中輕鬆控制多媒體視頻和音樂 129
9.1在頁面中插入視頻和音頻 129
9.1.1容器和編解碼器 129
9.1.2使用HTML5Video和AudioAPI的好處 131
9.1.3瀏覽器支持性檢測 132
9.1.4使用video/audio元素 132
9.1.5使用source元素來兼容 133
9.2video/audio元素的屬性 134
9.2.1通過HTML設定的屬性 134
9.2.2通過JavaScript設定的屬性 135
9.3video/audio元素的事件 136
9.3.1video/audio元素的主要事件 136
9.3.2設定當前播放位置 137
9.4video/audio元素的方法 138
9.4.1通過JavaScript控制的方法 138
9.4.2滑鼠懸停播放,移開暫停 139
9.5綜合套用——打造屬於自己的視頻播放器 139
9.5.1界面設計 139
9.5.2CSS3+HTML布局 140
9.5.3用JavaScript控制播放器 142
9.6相關參考 148
第10章用CSS3畫一個哆啦A夢 149
10.1CSS3簡介 149
10.1.1CSS3歷史情況 149
10.1.2CSS3的支持情況 150
10.2陰影和文本陰影 150
10.2.1陰影(box-shadow) 151
10.2.2文本陰影(text-shadow) 152
10.3圓角 154
10.3.1圓角(border-radius)屬性 154
10.3.2圓角變圓與半圓 155
10.4漸變 155
10.4.1線性漸變 155
10.4.2放射漸變 157
10.5綜合套用——畫一個哆啦A夢 158
10.5.1頭部和臉部 159
10.5.2脖子和鈴鐺 162
10.5.3身體和四肢 164
10.5.4讓眼睛動起來 168
10.6相關參考 169
第11章酷炫的CSS3動畫效果——3D旋轉方塊 170
11.1文本描邊和文本填充色 170
11.1.1文本描邊(text-stroke) 171
11.1.2文本填充(text-fill-color) 171
11.2變形和變形原點 172
11.2.1變形(transform) 172
11.2.2變形原點(transform-origin) 175
11.3簡單套用——飛行旋轉文本 176
11.3.1過渡動畫(transition) 177
11.3.2自定義動畫(animation)和@keyframes 178
11.3.3飛行旋轉的文本 179
11.4綜合套用——3D旋轉方塊 181
11.5相關參考 183
第12章一個可以離線的內容管理系統 185
12.1功能設計 185
12.2Web儲存和套用快取 186
12.2.1本地存儲(LocalStorage) 186
12.2.2會話存儲(SessionStorage) 187
12.2.3應用程式快取 187
12.2.4搭建支持套用快取的伺服器 188
12.2.5神奇的manifestfile檔案清單 189
12.3HTML5本地存儲 190
12.3.1WebIndexedDB 191
12.3.2WebSqlDatabase 193
12.4編寫內容管理系統 195
12.4.1可離線的HTML、JS和CSS 195
12.4.2添加數據 196
12.4.3列表和查詢數據 198
12.4.4更新數據 199
12.4.5刪除數據 199
12.4.6前端互動 200
12.5相關參考 201
第13章SVG動畫 202
13.1什麼是SVG 202
13.1.1SVG的歷史 202
13.1.2SVG的優缺點 203
13.1.3SVG的Helloworld 204
13.1.4SVG的調用方式 205
13.2SVG形狀 205
13.2.1矩形(rect) 206
13.2.2圓形(circle) 207
13.2.3橢圓(ellipse) 207
13.2.4線(line) 207
13.2.5折線(polyline) 208
13.2.6多邊形(polygon) 208
13.2.7路徑(path) 208
13.3SVG濾鏡 209
13.3.1高斯模糊濾鏡(feGaussianBlur) 210
13.3.2色彩轉換濾鏡(feColorMatrix) 210
13.3.3位移濾鏡(feOffset) 211
13.4SVG漸變 212
13.4.1線性漸變(linearGradient) 212
13.4.2放射漸變(radialGradient) 213
13.5製作簡單的SVG動畫——太陽系 214
13.5.1SVG繪製的太陽和地球公轉軌跡 215
13.5.2貼圖地球和地月系統 215
13.5.3太陽系 216
13.6相關參考 217
第三篇HTML5Canvas實戰篇
第14章Canvas的初步套用——再畫一個哆啦A夢 221
14.1什麼是Canvas 221
14.1.1Canvas起源 221
14.1.2Canvas的支持情況 222
14.1.3Canvas優缺點及與SVG的對比 222
14.1.4Canvas與JavaScript 223
14.1.5Canvas的發展 223
14.1.6Canvas標籤的使用 224
14.2繪製形狀和文字 224
14.2.1直線(lineTo) 225
14.2.2矩形(rect) 226
14.2.3圓(arc) 228
14.2.4弧和圓角(arcTo) 229
14.2.5貝塞爾曲線quadraticCurveTo 231
14.2.6繪製文本(fillText)和strokeText 232
14.3顏色、風格和陰影 233
14.3.1線性漸變(createLinearGradient) 233
14.3.2放射漸變(createRadialGradient) 235
14.3.3陰影 235
14.4再畫一個哆啦A夢 236
14.4.1準備工作 237
14.4.2繪製頭和臉 237
14.4.3繪製眼睛和鼻子 238
14.4.4繪製嘴巴和鬍鬚 239
14.5相關參考 239
第15章Canvas的高級套用——製作飛行遊戲 240
15.1轉換 240
15.1.1放大和縮小 240
15.1.2平移和旋轉 242
15.1.3矩陣轉換 244
15.2合成 246
15.2.1用Photoshop控制圖形合成 246
15.2.2使用Canvas控制圖形合成 246
15.3碰撞檢測 248
15.3.1圓形碰撞檢測 249
15.3.2矩形碰撞檢測 249
15.4讓遊戲動起來 250
15.4.1打飛機遊戲設計 250
15.4.2移動的星空 251
15.4.3載入資源 252
15.4.4我方戰機、敵機和子彈 253
15.4.5讓遊戲動起來 255
15.5相關參考 256
第16章Canvas的另類套用——壓縮和解壓 257
16.1繪製圖片 257
16.1.1繪製外部載入的圖片 258
16.1.2Canvas給視頻加字幕 259
16.2像素級操作 260
16.2.1反轉顏色-底片效果 260
16.2.2灰度控制——黑白灰效果 262
16.2.3透明度控制 263
16.2.4倒影 264
16.3實現壓縮解壓功能 266
16.3.1載入點陣圖 266
16.3.2壓縮點陣圖 266
16.3.3保存到本地 267
16.4相關參考 268
第四篇jQuery實戰篇
第17章jQuery簡介 271
17.1什麼是jQuery 271
17.1.1jQuery的歷史 272
17.1.2為什麼要使用jQuery 273
17.2編寫jQuery代碼 275
17.2.1下載jQuery 275
17.2.2簡單套用jQuery 276
17.2.3調試jQuery程式 277
17.3基於jQuery的UI外掛程式 280
17.3.1基於jQuery的擴展——jQueryUI外掛程式 280
17.3.2下載jQueryUI外掛程式 281
17.3.3簡單套用jQueryUI外掛程式 285
17.3.4其他UI框架 286
17.4相關參考 290
第18章用動態效果來回響瀏覽者 291
18.1jQuery庫基礎 291
18.1.1jQuery庫的核心方法——$() 291
18.1.2jQuery庫延遲等待載入模式 293
18.1.3jQuery對象與DOM對象間的轉換 293
18.2基礎選擇器 295
18.2.1簡單選擇器 295
18.2.2進階選擇器 298
18.2.3高級選擇器 303
18.3過濾選擇器 307
18.3.1jQuery所支持的過濾器 307
18.3.2頁面中的經典導航條 309
18.4操作DOM對象 312
18.4.1jQuery關於元素的操作 312
18.4.2關於表的經典效果 315
18.4.3jQuery關於節點的操作 316
18.4.4超級連結提示效果 318
18.4.5圖片預覽效果 320
18.5回響事件 322
18.5.1綁定和刪除事件 323
18.5.2jQuery所支持的事件和事件類型 325
18.5.3表單動態效果 327
18.6實現動態效果 334
18.6.1jQuery庫所支持的動畫方法 334
18.6.2實現可摺疊的列表 336
18.6.3淡入淡出效果 338
18.7相關參考 340
第19章用戶互動操作、進度條和滑動條美化頁面 341
19.1頁面中的互動操作 341
19.1.1jQueryUI所支持的拖動組件 341
19.1.2jQueryUI所支持的拖放組件 343
19.1.3模擬Windows系統“資源回收筒” 345
19.2頁面中的進度條效果 349
19.2.1jQueryUI所支持的進度條工具集 349
19.2.2實現進度條效果 350
19.3頁面中滑動條效果 352
19.3.1jQueryUI所支持的滑動條工具集 352
19.3.2實現圖片滑塊滾動條效果 353
19.3.3實現簡單顏色調色器 357
19.4相關參考 359
第20章用工具集實現酷炫的頁面 360
20.1實現“手風琴”效果 360
20.1.1jQueryUI所支持的摺疊面板工具集 360
20.1.2實現經典的導航選單 362
20.2設計頁面中各種對話框效果 363
20.2.1jQueryUI所支持的對話框工具集 364
20.2.2實現彈出和確認信息對話框效果 366
20.3處理頁面中的日期 368
20.3.1jQueryUI所支持的日期選擇器工具集 369
20.3.2實現日期輸入框 372
20.3.3實現選取時間段功能 373
20.4實現幻燈和分頁效果 376
20.4.1jQueryUI所支持的選項卡工具集 376
20.4.2經典的選項卡效果 377
20.4.3實現幻燈效果 380
20.4.4實現分頁效果 382
20.5相關參考 385
第五篇Node.js實戰篇
第21章Node.js簡介 389
21.1什麼是Node.js 389
21.1.1Node.js是平台 389
21.1.2Node.js不是萬能的 390
21.2獲取、安裝和配置Node.js 392
21.2.1Node.js獲取 392
21.2.2Node.js的安裝 393
21.2.3Node.js的配置 394
21.3Node.js與其他伺服器腳本語言的比較 395
21.4Node.js與客戶端JavaScript腳本的比較 396
21.5相關參考 397
第22章構造一個最簡單的Web伺服器 398
22.1Node.js中腳本檔案的組織 398
22.1.1CommonJS規範 399
22.1.2Node.js中的模組 399
22.1.3HTTP協定 400
22.2建立服務、路徑處理與回響 402
22.2.1用6行代碼創建的Web伺服器 402
22.2.2讓Web伺服器回響和處理不同路徑 403
22.3異步與檔案處理 405
22.3.1智慧型的404提示 405
22.3.2檔案格式MIME協定 408
22.3.3回響不同類型的檔案 410
22.4處理檔案上傳 413
22.4.1安裝並使用Node.js第三方模組 413
22.4.2用node-formidable處理上傳圖片 415
22.5相關參考 417
第23章基於Express框架的Http伺服器 419
23.1引入Express框架 419
23.1.1Express與Connect 419
23.1.2在Node.js環境下安裝Express 420
23.1.3用Express搭建簡單Web套用 421
23.2Express的程式控制 423
23.2.1模板引擎ejs 423
23.2.2中間件(middleware) 426
23.3Express的請求解析 427
23.3.1路由routes 427
23.3.2Request對象 429
23.4Express的回響控制 429
23.4.1wirte、end、send輸出回響到客戶端 430
23.4.2JSON、JSONP輸出回響到客戶端 431
23.4.3設定cookie 432
23.4.4其他回響控制 432
23.5相關參考 432
第24章構造一個基於Socket的聊天系統 433
24.1建立Socket伺服器 433
24.1.1安裝Socket.IO 434
24.1.2聊天室服務端 435
24.2HTML5中的WebSocket 436
24.2.1WebSocket協定 436
24.2.2Nginx對WebSocket的支持 437
24.2.3WebSocket常用API 437
24.3在Node.js中運算元據庫 438
24.3.1操作MSSQLServer 438
24.3.2操作MySQL 440
24.3.3操作MongoDB 444
24.4完善聊天系統 446
24.4.1聊天室客戶端 446
24.4.2Socket.IO常見API 447
24.5相關參考 448

熱門詞條

聯絡我們