前言

第1章　用HTML 5中的結構元素構建網站/1

1.1　案例1：用HTML 5中的結構元素構建一個博客網站/2

1.1.1　案例知識點/2

1.1.2　博客首頁的實現/11

1.1.3　文章顯示頁面的實現/30

1.2　案例2：用HTML 5中的結構元素構建一個企業網站/39

1.2.1　首頁的實現/39

1.2.2　聯系方式頁面的實現/52

1.3　本章小結/55

第2章　在Web表單中使用HTML 5/56

2.1　案例3：用結構元素制作Web應用程序中的菜單/57

2.1.1　頁面顯示效果/57

2.1.2　代碼剖析/58

2.2　案例4：綜合運用HTML 5、jQuery與ASP.NET構建Web應用程序/61

2.2.1　案例概述/61

2.2.2　頁面顯示效果/61

2.2.3　案例知識點 /63

2.2.4　代碼剖析/70

2.3　本章小結/96

第3章　使用canvas元素繪制圖形、圖像與動畫/97

3.1　案例5：使用canvas元素繪制美麗的花朵/98

3.1.1　案例概述/98

3.1.2　頁面顯示效果/98

3.1.3　案例知識點/100

3.1.4　代碼剖析/103

3.2　案例6：使用canvas元素繪制指針式動畫時鐘/106

3.2.1　案例概述/106

3.2.2　頁面顯示效果/106

3.2.3　案例知識點/107

3.2.4　代碼剖析/108

3.3　案例7：使用canvas元素制作簡單小游戲/113

3.3.1　案例概述/113

3.3.2　頁面顯示效果/113

3.3.3　案例知識點/115

3.3.4　代碼剖析/116

3.4　案例8：使用canvas元素繪制圖像放大鏡/119

3.4.1　案例概述/120

3.4.2　頁面顯示效果/120

3.4.3　案例知識點/120

3.4.4　代碼剖析/121

3.5　案例9：用動畫的形式裝載圖像/125

3.5.1　案例概述/125

3.5.2　頁面顯示效果/125

3.5.3　案例知識點/128

3.5.4　代碼剖析/130

3.6　案例10：將彩色照片轉換成黑白照片/138

3.6.1　案例概述/138

3.6.2　頁面顯示效果/138

3.6.3　案例知識點/140

3.6.4　代碼剖析/141

3.7　本章小結/143

第4章　文件API與拖放API/145

4.1　案例11：在瀏覽器中預覽客戶端文件并上傳/146

4.1.1　案例概述/146

4.1.2　頁面顯示效果/146

4.1.3　案例知識點/149

4.1.4　代碼剖析/151

4.2　案例12：使用Canvas API、文件API與拖放API制作拼圖游戲/158

4.2.1　案例概述/158

4.2.2　頁面顯示效果/159

4.2.3　案例知識點/162

4.2.4　代碼剖析/165

4.3　本章小結/176

第5章　多媒體播放/177

5.1　案例13：打造自己的網頁視頻播放器/178

5.1.1　案例概述/178

5.1.2　頁面顯示效果/178

5.1.3　案例知識點/181

5.1.4　代碼剖析/183

5.2　案例14：對視頻使用實時回放功能/191

5.2.1　案例概述/191

5.2.2　頁面顯示效果/191

5.2.3　代碼剖析/192

5.3　案例15：對視頻使用截圖功能/195

5.3.1　案例概述/195

5.3.2　頁面顯示效果/195

5.3.3　案例知識點/196

5.3.4　代碼剖析/196

5.4　案例16：打造自己的網頁音頻播放器/199

5.4.1　案例概述/199

5.4.2　頁面顯示效果/199

5.4.3　案例知識點/200

5.4.4　代碼剖析/201

5.5　本章小結/206

第6章　本地存儲/207

6.1　案例17：制作HTML 5版本的日程提醒簿/208

6.1.1　案例概述/208

6.1.2　頁面顯示效果/208

6.1.3　案例知識點/209

6.1.4　代碼剖析/210

6.2　案例18：臨時保存頁面中的輸入內容/214

6.2.1　案例概述/214

6.2.2　頁面顯示效果/215

6.2.3　案例知識點/216

6.2.4　代碼剖析/216

6.3　案例19：使用HTML 5制作Web應用程序的演示版/218

6.3.1　案例概述/218

6.3.2　頁面顯示效果/218

6.3.3　案例知識點/219

6.3.4　代碼剖析/222

6.4　案例20：使用客戶端session/232

6.4.1　案例概述/232

6.4.2　頁面展示效果/232

6.4.3　案例知識點/234

6.4.4　代碼剖析/235

6.5　案例21：將本地數據庫中的數據提交到服務器端/248

6.5.1　案例概述/248

6.5.2　頁面展示效果/248

6.5.3　代碼剖析/249

6.6　案例22：制作可以離線使用的日程提醒簿/256

6.6.1　案例概述/256

6.6.2　頁面顯示效果/256

6.6.3　案例知識點/257

6.6.4　代碼剖析/260

6.7　本章小結/261

第7章　跨文檔消息傳輸/262

7.1　案例23：通過跨文檔消息傳輸功能實現單點登錄/263

7.1.1　案例概述/263

7.1.2　頁面顯示效果/264

7.1.3　案例知識點/268

7.1.4　代碼剖析/268

7.2　案例24：通過跨文檔消息傳輸功能獲取批量數據/300

7.2.1　案例概述/300

7.2.2　頁面顯示效果/300

7.2.3　代碼剖析/301

7.3　本章小結/310

第8章　利用Web Workers實現多線程處理/312

8.1　案例25：在后臺線程中實現對數據庫的增刪查改操作/313

8.1.1　案例概述/313

8.1.2　頁面顯示效果/313

8.1.3　案例知識點/315

8.1.4　代碼剖析/316

8.2　案例26：在后臺線程中實現數據的批量插入/334

8.2.1　案例概述/334

8.2.2　代碼剖析/334

8.3　本章小結/339

第9章　利用Geolocation API獲取地理位置信息/341

9.1　案例27：顯示計算機或移動設備所在地的地圖/342

9.1.1　案例概述/342

9.1.2　頁面顯示效果/342

9.1.3　案例知識點/343

9.1.4　代碼剖析/346

9.2　本章小結/349

第10章　使用jWebSocket框架開發Socket通信程序/350

10.1　安裝與運行jWebSocket/351

10.1.1　安裝jWebSocket服務器/351

10.1.2　在其他服務器環境下運行jWebSocket服務器/352

10.1.3　將jWebSocket服務器作為Windows的可執行文件/354

10.1.4　將jWebSocket服務器作為Windows的服務/355

10.1.5　jWebSocket Web客戶端/355

10.2　創建第一個利用jWebSocket進行通信的Web頁面/357

10.3　創建jWebSocket服務器端的偵聽器/365

10.3.1　jWebSocket的通信架構/365

10.3.2　創建偵聽器/366

10.4　jWebSocket中的令牌/374

10.4.1　令牌的基本概念/375

10.4.2　系統令牌/376

10.5　jWebSocket中服務器端的插件/383

10.5.1　服務器端插件的基礎知識/383

10.5.2　創建自定義服務器端插件/385

10.6　jWebSocket中的通道/393

10.7　案例28：利用jWebSocket服務器創建簡單聊天室/398

10.7.1　案例概述/398

10.7.2　頁面顯示效果/398

10.7.3　代碼剖析/401

10.8　本章小結/412

第11章　RGraph統計圖制作插件/414

11.1　概述/415

11.1.1　HTML 5版統計圖插件的優越性/415

11.1.2　使用RGraph插件/415

11.1.3　使用服務器端數據/416

11.2　繪制統計圖時所用到的公共屬性/417

11.3　繪制柱狀圖/422

11.3.1　繪制柱狀圖時所用到的屬性/422

11.3.2　示例程序/425

11.3.3　使用obj.getBar方法/426

11.3.4　繪制分組柱狀圖/428

11.3.5　使用上下文菜單/432

11.4　繪制折線圖/435

11.4.1　繪制折線圖時所用到的屬性/435

11.4.2　繪制基本折線圖/439

11.4.3　使用getPoint方法/441

11.4.4　在一個折線圖中繪制多根折線/444

11.4.5　繪制范圍折線圖/446

11.4.6　在一個折線圖中使用左右兩根不同統計單位的垂直坐標軸/448

11.4.7　在一個統計圖中繪制柱狀圖與折線圖/450

11.4.8　繪制動態折線圖/452

11.5　繪制餅圖/455

11.5.1　繪制餅圖時所用到的屬性/455

11.5.2　示例程序/455

11.5.3　使用getSegment方法/457

11.6　繪制橫向柱狀圖/461

11.6.1　繪制橫向柱狀圖時所用到的屬性/461

11.6.2　示例程序/463

11.6.3　繪制分組橫向柱狀圖/464

11.7　繪制雷達圖/466

11.7.1　繪制雷達圖時所用到的屬性/466

11.7.2　示例程序/467

11.8　增強用戶體驗/468

11.8.1　通過拖曳來縮放統計圖的尺寸/468

11.8.2　制作工具條提示信息/469

11.8.3　制作上下文菜單/475

11.8.4　放大統計圖/476

11.8.5　允許用戶注解統計圖/481

11.9　本章小結/483

第12章　使用WebGL開發三維圖形圖像/484

12.1　WebGL概述/485

12.1.1　WebGL的基礎知識/485

12.1.2　進行WebGL開發之前的準備工作/485

12.2　使用WebGL繪制三角形與矩形/488

12.2.1　下載并使用腳本文件/488

12.2.2　頁面顯示效果/488

12.2.3　代碼剖析/488

12.3　使用顏色繪制彩色三角形與矩形/507

12.3.1　畫面式樣/507

12.3.2　代碼剖析/507

12.4　制作三維動畫/515

12.4.1　畫面式樣/515

12.4.2　代碼剖析/515

12.5　制作三維物體/520

12.5.1　畫面式樣/520

12.5.2　代碼剖析/520

12.6　使用紋理/528

12.6.1　畫面式樣/528

12.6.2　代碼剖析/528

12.7　鍵盤輸入與紋理過濾/537

12.7.1　畫面式樣/537

12.7.2　代碼剖析/538

12.8　本章小結/545

附錄　五大瀏覽器的最新版對HTML 5的支持情況/546