細(xì)說(shuō)HTML5高級(jí)API

第1章  鳥(niǎo)瞰HTML5 1
1．1  原生還是混合 1
1．1．1  原生應(yīng)用的優(yōu)缺點(diǎn) 2
1．1．2  混合應(yīng)用的優(yōu)缺點(diǎn) 2
1．2  移動(dòng)端Web站點(diǎn)和原生應(yīng)用 3
1．2．1  構(gòu)建移動(dòng)端解決方案 3
1．2．2  建立成功的移動(dòng)端方案 4
1．3．  Web API和APP組件開(kāi)發(fā) 5
1．3．1  面向API方式的開(kāi)發(fā)方式 6
1．3．2  組件化自動(dòng)化構(gòu)建 7
1．3．3  未來(lái)展望 7
1．4  本章總結(jié) 8
第2章  HTML5 bMap地理位置與服務(wù) 9
2．1  基本知識(shí)之經(jīng)緯度 9
2．2  bMap JavaScript API實(shí)例之Hello bMap 10
2．2．1  創(chuàng)建賬戶和申請(qǐng)密鑰 11
2．2．2  Hello bMap應(yīng)用 13
2．3  應(yīng)用bMap JavaScript API 15
2．3．1  實(shí)例之添加定位控件 15
2．3．2  實(shí)例之步行路線 18
2．3．3  實(shí)例之駕車路線 21
2．3．4  實(shí)例之公交路線 23
2．3．5  實(shí)例之本地搜索 25
2．4  本章總結(jié) 27
練習(xí)題 28
第3章  HTML5本地存儲(chǔ) 29
3．1  Web Storage API 29
3．1．1  使用Web Storage API的好處 29
3．1．2  瀏覽器客戶端常用的存儲(chǔ)數(shù)據(jù)方式 30
3．1．3  簡(jiǎn)單存儲(chǔ)實(shí)例 30
3．2  Web Storage的常用方法 32
3．2．1  setItem()與getItem()方法的使用 32
3．2．2  key()方法的使用 32
3．2．3  removeItem()和clear()方法的使用 34
3．3  實(shí)例：幻燈播放 35
3．3．1  impress的介紹與下載 35
3．3．2  效果與代碼清單 36
3．3．3  impress．js的主要方法 38
3．4  本章小結(jié) 39
練習(xí)題 40
第4章  HTML5 Canvas API應(yīng)用 41
4．1  什么是Canvas 41
4．1．1  Canvas的由來(lái) 41
4．1．2  Canvas的概念 42
4．2  如何使用Canvas 43
4．2．1  使用Canvas API的基本知識(shí) 43
4．2．2  檢測(cè)瀏覽器是否支持Canvas 44
4．2．3  Canvas與CSS的關(guān)系與應(yīng)用 46
4．3  使用Canvas繪制矩形的對(duì)角線 48
4．3．1  HTML代碼實(shí)例 48
4．3．2  思路分析 51
4．4  使用Canvas API繪制圓 51
4．4．1  繪制圓的參數(shù)說(shuō)明 51
4．4．2  繪制圓的HTML代碼清單 52
4．4．3  繪制圓的效果圖 53
4．5  使用Canvas API繪制矩形 54
4．5．1  繪制矩形的參數(shù)說(shuō)明 54
4．5．2  繪制矩形的HTML代碼 54
4．5．3  繪制矩形的效果圖 55
4．6  使用Canvas繪制時(shí)鐘的實(shí)例 56
4．6．1  繪制時(shí)鐘的原理 56
4．6．2  繪制時(shí)鐘的HTML代碼清單 56
4．6．3  繪制時(shí)鐘的效果圖 60
4．7  本章總結(jié) 60
練習(xí)題 61
第5章  HTML5中的WebSocket的應(yīng)用 63
5．1  認(rèn)識(shí)WebSocket API 63
5．1．1  簡(jiǎn)單理解WebSocket 63
5．1．2  WebSocket協(xié)議和HTTP的不同 64
5．2  WebSocket和HTTP會(huì)話演示 67
5．2．1  HTTP的會(huì)話演示 67
5．2．2  WebSocket的會(huì)話演示 67
5．2．3  瀏覽器的支持情況 68
5．2．4  WebSocket的API常用的方法和屬性 68
5．3  經(jīng)典案例：WebSocket聊天室 69
5．3．1  服務(wù)器代碼片段 70
5．3．2  HTML界面代碼片段 72
5．3．3  客戶端的實(shí)現(xiàn) 75
5．3．4  效果演示和詳解 78
5．4  本章總結(jié) 81
第6章  FileReader API的引用 82
6．1  FileReader API的概念 82
6．2  FileReader API的相關(guān)方法 83
6．2．1  readAsText()方法 83
6．2．2  readAsDataURL()方法 83
6．2．3  readAsBinaryString()方法 84
6．2．4  readAsArrayBuffer()方法 84
6．2．5  abort()方法 84
6．3  實(shí)例：讀取文本內(nèi)容 84
6．3．1  思路分析 84
6．3．2  HTML文檔代碼片段 85
6．3．3  JavaScript代碼片段 86
6．3．4  簡(jiǎn)單的CSS代碼片段 87
6．3．5  必要屬性和事件驅(qū)動(dòng) 87
6．4  實(shí)例：讀取圖像文件 89
6．4．1  JavaScript代碼片段 89
6．4．2  HTML代碼片段 89
6．4．3  CSS代碼片段 91
6．4．4  思路梳理 91
6．5  本章總結(jié) 93
練習(xí)題 93
第7章  HTML5拖放API 95
7．1  DOM和CSS實(shí)現(xiàn)的類似拖放功能的弊端 95
7．2  拖放API的概念 96
7．3  拖放API的事件和說(shuō)明 97
7．4  拖放API的使用 97
7．5  實(shí)例1：經(jīng)典列表拖放 98
7．6  實(shí)例2：文件拖放 101
7．7  本章總結(jié) 104
練習(xí)題 104
第8章  Apache Cordova簡(jiǎn)介 106
8．1  Cordova或PhoneGap 106
8．1．1  Cordova的由來(lái) 107
8．1．2  Cordova和PhoneGap的區(qū)別 108
8．1．3  Cordova的特點(diǎn) 108
8．1．4  注意事項(xiàng) 109
8．2  搭建Cordova環(huán)境 109
8．2．1  安裝Node．js 109
8．2．2  安裝和使用Node．js版本管理工具 113
8．3  安裝使用Cordova 116
8．3．1  安裝Cordova到系統(tǒng)中 116
8．3．2  使用淘寶的鏡像 117
8．3．3  創(chuàng)建第一個(gè)Cordova APP 118
8．3．4  項(xiàng)目目錄的結(jié)構(gòu)講解 120
8．3．5  單頁(yè)面應(yīng)用 121
8．4  本章總結(jié) 124
練習(xí)題 125
第9章  Cordova的真機(jī)調(diào)試和必備知識(shí) 126
9．1  JDK的安裝與配置 126
9．1．1  在Mac OS X上安裝JDK 127
9．1．2  在Windows平臺(tái)上安裝JDK 128
9．1．3  測(cè)試Java是否安裝成功 129
9．1．4  在Windows平臺(tái)上配置環(huán)境變量 129
9．2  Android Studio的下載與安裝 132
9．2．1  Mac上Android Studio的下載與安裝 132
9．2．2  Windows上Android Studio的下載與安裝 133
9．3  Android Studio的SDK包的管理 134
9．3．1  安裝必要的SDK 134
9．3．2  單例模式下運(yùn)行SDK Manager 135
9．4  安卓真機(jī)的運(yùn)行與調(diào)試 136
9．4．1  創(chuàng)建一個(gè)名為HelloAndroid的APP 136
9．4．2  添加安卓平臺(tái) 136
9．4．3  查看編譯環(huán)境 137
9．4．4  編譯安卓應(yīng)用 137
9．4．5  安裝到安卓手機(jī)并運(yùn)行 138
9．5  蘋(píng)果手機(jī)的真機(jī)調(diào)試 139
9．5．1  新建一個(gè)名為hello的APP 139
9．5．2  打開(kāi)Xcode，加載項(xiàng)目 140
9．5．3  編譯和安裝hello項(xiàng)目 140
9．5．4  重新打開(kāi)手機(jī)上名為hello的APP 141
9．6  Cordova編輯器小知識(shí) 142
9．6．1  SublimeText3 142
9．6．2  WebStorm 143
9．7  本章總結(jié) 144
練習(xí)題 144
第10章  Cordova開(kāi)發(fā)基礎(chǔ) 146
10．1  什么是flexbox 146
10．2  理解flexbox布局模型 147
10．3  深入理解伸縮容器的屬性 148
10．3．1  display屬性 149
10．3．2  flex-direction屬性 150
10．3．3  flex-wrap屬性 153
10．3．4  flex-flow屬性 156
10．3．5  justify-content屬性 158
10．3．6  align-items屬性 162
10．3．7  align-content屬性 167
10．4  深入理解伸縮項(xiàng)目的屬性 173
10．4．1  order屬性 174
10．4．2  flex-grow屬性 175
10．4．3  flex-shrink 177
10．4．4  flex-basis屬性 178
10．4．5  flex屬性 180
10．4．6  align-self屬性 181
10．5  本章總結(jié) 187
練習(xí)題 188
第11章  Cordova中的事件處理 189
11．1  關(guān)于Cordova生命周期 189
11．1．1  認(rèn)識(shí)程序的生命周期 189
11．1．2  理解Cordova生命周期中的事件 191
11．2  Cordova生命周期事件的使用 194
11．2．1  Cordova的生命周期中的程序加載狀態(tài)事件 194
11．2．2  Cordova生命周期中的設(shè)備狀態(tài)事件 198
11．2．3  Cordova生命周期中的用戶主動(dòng)觸發(fā)事件 200
11．3  本章總結(jié) 204
練習(xí)題 204
第12章  Cordova地理位置信息服務(wù) 206
12．1  Geolocation API的使用 206
12．1．1  獲取設(shè)備的地理位置信息 207
12．1．2  獲取設(shè)備坐標(biāo)的實(shí)例 207
12．2  監(jiān)聽(tīng)設(shè)備信息變化 210
12．2．1  監(jiān)聽(tīng)設(shè)備地理位置實(shí)例 210
12．2．2  監(jiān)聽(tīng)地理位置信息變化參數(shù)分析 213
12．3  本章總結(jié) 213
練習(xí)題 214
第13章  Cordova設(shè)備方向API 216
13．1  獲取當(dāng)前設(shè)備的方向案例 216
13．2  監(jiān)測(cè)當(dāng)前設(shè)備的位置信息 220
13．3  仿微信搖一搖功能的實(shí)例 222
13．4  本章總結(jié) 225
練習(xí)題 226
第14章  Cordova中的多媒體 228
14．1  播放遠(yuǎn)程音樂(lè) 228
14．2  暫停音樂(lè)播放 234
14．3  停止音樂(lè)播放 236
14．4  追蹤顯示播放進(jìn)度 238
14．5  從指定的位置播放 240
14．6  錄制聲音與播放聲音 242
14．7  資源與性能優(yōu)化 244
14．8  本章總結(jié) 245
練習(xí)題 245
第15章  Cordova中的內(nèi)置瀏覽器 247
15．1  認(rèn)識(shí)內(nèi)置瀏覽器 247
15．2  第一個(gè)簡(jiǎn)單的實(shí)例 248
15．3  第二個(gè)實(shí)例：自定義URL 250
15．4  本章總結(jié) 253
練習(xí)題 253
第16章  Cordova中的數(shù)據(jù)庫(kù)存儲(chǔ) 255
16．1  Cordova中的本地存儲(chǔ) 255
16．1．1  Web端的本地存儲(chǔ) 255
16．1．2  Cordova應(yīng)用中的本地存儲(chǔ) 258
16．2  Cordova中的數(shù)據(jù)庫(kù) 259
16．2．1  認(rèn)識(shí)Cordova中的SQLite API 261
16．2．2  使用SQLite SQL 261
16．3  本章總結(jié) 266
練習(xí)題 266
第17章  Cordova中的Device Motion API 268
17．1  使用加速傳感器 268
17．1．1  加速度的概念 268
17．1．2  獲取當(dāng)前加速度的實(shí)例 269
17．2  監(jiān)控設(shè)備的加速度 271
17．2．1  如何監(jiān)控當(dāng)前設(shè)備的加速度 271
17．2．2  監(jiān)測(cè)當(dāng)前設(shè)備加速度的實(shí)例 272
17．2．3  深入理解“加速度” 274
17．2．4  哪些場(chǎng)景可以應(yīng)用加速傳感器 275
17．3  本章總結(jié) 278
練習(xí)題 278