移動Web開發(fā)從入門到精通

Chapter 1 移動Web開發(fā)基礎(chǔ) 1 1.1 認(rèn)識網(wǎng)頁和網(wǎng)站 1 1.1.1 網(wǎng)頁 1 1.1.2 網(wǎng)站 2 1.2 網(wǎng)頁的基本構(gòu)成元素 2 1.3 制作網(wǎng)頁的基本流程 4 1.4 制作網(wǎng)站的基本流程 5 1.4.1 網(wǎng)站發(fā)展趨勢 5 1.4.2 網(wǎng)站制作流程 6 1.4.3 網(wǎng)站設(shè)計原則 7 1.5 Web標(biāo)準(zhǔn)開發(fā)技術(shù)介紹 7 1.5.1 結(jié)構(gòu)化標(biāo)準(zhǔn)語言 7 1.5.2 表現(xiàn)性標(biāo)準(zhǔn)語言 8 1.5.3 行為標(biāo)準(zhǔn) 8 1.6 移動Web開發(fā)概覽 9 1.6.1 主流移動平臺介紹 9 1.6.2 移動Web的特點(diǎn) 11 1.6.3 設(shè)計移動網(wǎng)站時需要考慮的問題 12 1.6.4 主流的移動設(shè)備屏幕的分辨率 12 1.6.5 使用標(biāo)準(zhǔn)的HTML、CSS和JavaScript技術(shù) 13 1.7 移動Web開發(fā)技術(shù)必備 13 Chapter 2 搭建移動Web開發(fā)環(huán)境 15 2.1 安裝Dreamweaver CS6 15 2.2 安裝jQuer Mobile 19 2.2.1 下載jQuer Mobile插件 19 2.2.2 使用URL方式加載插件文件 20 2.3 搭建PhoneGap開發(fā)環(huán)境 20 2.3.1 準(zhǔn)備工作 20 2.3.2 獲得PhoneGap開發(fā)包 21 2.4 搭建測試環(huán)境 25 Chapter 3 移動Web開發(fā)的準(zhǔn)備工作 27 3.1 創(chuàng)建通用網(wǎng)站的實(shí)現(xiàn)流程 27 3.1.1 確定應(yīng)用程序類型 27 3.1.2 使用CSS改善HTML外觀 28 3.1.3 加入移動meta標(biāo)簽 30 3.2 將站點(diǎn)升級至HTML 5 31 3.2.1 確定何時升級和升級的具體方式 31 3.2.2 升級到HTML 5的步驟 33 3.2.3 將HTML 5特性作為額外內(nèi)容添加至網(wǎng)站 33 3.2.4 使用HTML 5為移動Web提供的服務(wù) 34 3.3 將Web程序遷移到移動設(shè)備 34 3.3.1 選擇Web編輯器 34 3.3.2 測試應(yīng)用程序 35 3.3.3 為移動設(shè)備調(diào)整可視化的設(shè)計 35 3.3.4 HTML 5及CSS 3檢測 36 3.4 搭建Android開發(fā)環(huán)境 38 3.4.1 安裝Android SDK的系統(tǒng)要求 38 3.4.2 安裝JDK 38 3.4.3 獲取并安裝Eclipse和Android SDK 42 3.4.4 安裝ADT 45 3.4.5 設(shè)定Android SDK Home 47 3.4.6 驗(yàn)證開發(fā)環(huán)境 48 3.4.7 創(chuàng)建并管理Android虛擬設(shè)備（AVD） 49 3.4.8 啟動AVD模擬器 50 3.5 搭建iOS開發(fā)環(huán)境 51 3.5.1 開發(fā)前的準(zhǔn)備——加入iOS開發(fā)團(tuán)隊(duì) 52 3.5.2 安裝Xcode 54 3.5.3 Xcode介紹 54 3.5.4 下載并安裝Xcode 55 3.5.5 創(chuàng)建一個Xcode項(xiàng)目并啟動模擬器 58 Chapter 4 HTML基礎(chǔ) 62 4.1 HTML初步 62 4.1.1 HTML概述 62 4.1.2 HTML基本結(jié)構(gòu) 63 4.2 HTML標(biāo)記詳解 64 4.2.1 標(biāo)題文字標(biāo)記＜h＞ 64 4.2.2 文本文字標(biāo)記＜font＞ 65 4.2.3 字型設(shè)置標(biāo)記 66 4.2.4 段落標(biāo)記＜p＞ 67 4.2.5 換行標(biāo)記＜br＞ 68 4.2.6 超鏈接標(biāo)記＜a＞ 68 4.2.7 設(shè)置背景圖片標(biāo)記＜bod background＞ 70 4.2.8 插入圖片標(biāo)記＜img＞ 70 4.2.9 列表標(biāo)記 71 4.2.10 表格標(biāo)記＜table＞、＜tr＞、＜th＞和＜td＞ 75 4.3 綜合應(yīng)用——制作一個簡單網(wǎng)頁 76 Chapter 5 HTML 5在移動設(shè)備中 80 5.1 把握未來的風(fēng)向標(biāo) 80 5.2 用HTML 5設(shè)計移動網(wǎng)站前的準(zhǔn)備 81 5.2.1 為移動網(wǎng)站準(zhǔn)備專用的域名 81 5.2.2 準(zhǔn)備測試環(huán)境 81 5.3 全新的HTML 5 82 5.4 設(shè)置網(wǎng)頁頭部元素 83 5.4.1 設(shè)置文檔類型 83 5.4.2 設(shè)置所有鏈接規(guī)定默認(rèn)地址或默認(rèn)目標(biāo) 84 5.4.3 鏈接標(biāo)簽 84 5.4.4 設(shè)置有關(guān)頁面的元信息 86 5.4.5 定義客戶端腳本 86 5.4.6 定義HTML文檔的樣式信息 87 5.4.7 設(shè)置頁面標(biāo)題 88 5.5 設(shè)置頁面正文 89 5.6 注釋 90 5.7 和頁面結(jié)構(gòu)相關(guān)的新元素 91 5.7.1 定義區(qū)段的標(biāo)簽 91 5.7.2 定義獨(dú)立內(nèi)容的標(biāo)簽 91 5.7.3 定義導(dǎo)航鏈接標(biāo)簽 92 5.7.4 定義其所處內(nèi)容之外的內(nèi)容 93 5.7.5 定義頁腳內(nèi)容的標(biāo)簽 93 5.8 在網(wǎng)頁中顯示聯(lián)系信息 94 5.9 自動隱藏或顯示網(wǎng)頁中的文字 95 5.10 綜合應(yīng)用——自動檢測輸入的拼音是否正確 96 Chapter 6 CSS基礎(chǔ) 98 6.1 體驗(yàn)CSS的功能 98 6.2 基本語法 99 6.3 使用選擇符 100 6.3.1 選擇符的種類 100 6.3.2 實(shí)戰(zhàn)演練——使用id選擇符設(shè)置文字顏色 102 6.4 CSS屬性 103 6.5 幾個常用值 104 6.5.1 顏色單位 104 6.5.2 長度單位 106 6.5.3 百分比值 107 6.5.4 URL統(tǒng)一資源定位符 107 6.5.5 URL默認(rèn)值 108 6.6 在網(wǎng)頁中使用CSS 108 6.6.1 頁面調(diào)用CSS方式 108 6.6.2 通用優(yōu)先級實(shí)戰(zhàn) 110 6.6.3 類型選擇符和類選擇符實(shí)戰(zhàn) 112 6.6.4 id選擇符實(shí)戰(zhàn) 113 6.6.5 最近優(yōu)先原則實(shí)戰(zhàn) 114 6.7 CSS的編碼規(guī)范 115 6.7.1 書寫規(guī)范 115 6.7.2 命名規(guī)范 115 6.8 CSS調(diào)試 116 6.8.1 設(shè)計軟件調(diào)試 116 6.8.2 繼承性和默認(rèn)值帶來的問題 117 6.9 綜合應(yīng)用——實(shí)現(xiàn)精致、符合標(biāo)準(zhǔn)的表單頁面 119 Chapter 7 JavaScript腳本語言 121 7.1 JavaScript簡介 121 7.1.1 JavaScript格式 121 7.1.2 一個典型的JavaScript文件 121 7.2 數(shù)據(jù)類型 122 7.2.1 數(shù)據(jù)類型概述 122 7.2.2 JavaScript常量 123 7.2.3 JavaScript變量 123 7.3 表達(dá)式和運(yùn)算符 124 7.3.1 JavaScript表達(dá)式 124 7.3.2 JavaScript運(yùn)算符 125 7.4 JavaScript循環(huán)語句 127 7.4.1 if條件語句 127 7.4.2 for循環(huán)語句 130 7.4.3 while循環(huán)語句 131 7.4.4 do…while循環(huán)語句 133 7.4.5 break控制 134 7.4.6 switch循環(huán)語句 134 7.5 JavaScript函數(shù) 134 7.5.1 函數(shù)的構(gòu)成 135 7.5.2 JavaScript常用函數(shù) 136 7.6 JavaScript對象 137 7.6.1 對象基礎(chǔ)知識 137 7.6.2 JavaScript常用對象和方法 139 7.7 JavaScript事件 142 7.7.1 JavaScript常用事件 142 7.7.2 事件處理程序 143 7.8 JavaScript窗口對象 144 7.8.1 窗口對象 144 7.8.2 窗口對象的事件驅(qū)動 145 7.8.3 窗口對象中的屬性 145 7.8.4 窗口對象的方法 145 7.8.5 JavaScript窗口對象的應(yīng)用 146 7.9 JavaScript框架對象 148 Chapter 8 使用jQuer Mobile 框架 150 8.1 jQuer Mobile簡介 150 8.1.1 jQuer的優(yōu)勢 150 8.1.2 jQuer Mobile的特點(diǎn) 151 8.1.3 jQuer Mobile對瀏覽器的支持 151 8.1.4 jQuer Mobile對移動平臺的支持 152 8.2 jQuer Mobile的四大優(yōu)勢 153 8.2.1 跨所有移動平臺的統(tǒng)一UI 153 8.2.2 簡化的標(biāo)記驅(qū)動的開發(fā) 153 8.2.3 漸進(jìn)式增強(qiáng) 153 8.2.4 響應(yīng)式設(shè)計 154 8.3 jQuer Mobile語法基礎(chǔ) 154 8.3.1 使用基本框架 155 8.3.2 多頁面模板 158 8.3.3 設(shè)置內(nèi)部頁面的頁面標(biāo)題 160 8.3.4 設(shè)置外部頁面鏈接 161 8.3.5 實(shí)現(xiàn)頁面后退鏈接 161 8.3.6 使用Ajax修飾導(dǎo)航 162 8.3.7 使用函數(shù)changePage() 165 8.4 預(yù)加載 166 8.5 頁面緩存 167 8.6 頁面腳本 169 Chapter 9 使用PhoneGap 171 9.1 PhoneGap基礎(chǔ) 171 9.1.1 產(chǎn)生背景 171 9.1.2 PhoneGap的發(fā)展歷程 172 9.1.3 PhoneGap移動Web開發(fā)的步驟 172 9.2 PhoneGap API詳解 173 9.2.1 應(yīng)用API 174 9.2.2 通知API 175 9.2.3 設(shè)備API 177 9.2.4 網(wǎng)絡(luò)連接API 178 9.2.5 加速計API 180 9.2.6 地理位置API 183 9.2.7 指南針API 185 9.2.8 照相機(jī)API 187 9.2.9 Capture采集 191 9.2.10 Media API 193 9.3 綜合應(yīng)用——使用Media構(gòu)造一個播放器 194 Chapter 10 開發(fā)移動設(shè)備網(wǎng)頁 197 10.1 編寫第一個適用于Android系統(tǒng)的網(wǎng)頁 197 10.1.1 控制頁面的縮放 200 10.1.2 添加CSS樣式 201 10.1.3 添加JavaScript 204 10.2 添加Ajax特效 206 10.3 打造一個iOS+jQuer Mobile+PhoneGap程序 212 10.4 綜合演練——打造一個Android+jQuer Mobile+ PhoneGap程序 214 10.4.1 建立一個基于Web的Android應(yīng)用 215 10.4.2 添加Web內(nèi)容 216 10.4.3 利用PhoneGap封裝成移動Web應(yīng)用 217 10.4.4 修改權(quán)限文件 219 Chapter 11 Web Sockets實(shí)時數(shù)據(jù)處理 221 11.1 安裝jWebSocket服務(wù)器 221 11.2 實(shí)現(xiàn)跨文檔傳輸數(shù)據(jù) 222 11.3 使用WebSocket傳送數(shù)據(jù) 225 11.3.1 使用Web Sockets API的方法 226 11.3.2 實(shí)戰(zhàn)演練 226 11.4 處理JSON對象 229 11.5 jWebSocket框架 232 11.5.1 jWebSocket框架的構(gòu)成 232 11.5.2 創(chuàng)建jWebSocket服務(wù)器端的偵聽器 232 11.6 jWebSocket令牌詳解 240 11.6.1 令牌的格式 240 11.6.2 令牌的常用術(shù)語 240 11.6.3 系統(tǒng)令牌詳解 241 11.7 綜合應(yīng)用——使用jWebSocketTest框架進(jìn)行通信 247 Chapter 12 Web Workers通信處理 251 12.1 Web Workers API基礎(chǔ) 251 12.1.1 使用HTML5 Web Workers API 251 12.1.2 需要使用.js 文件 252 12.1.3 與 Web Worker 進(jìn)行雙向通信 252 12.2 Worker線程處理 254 12.2.1 使用Worker處理線程 255 12.2.2 使用線程傳遞JSON對象 258 12.2.3 使用線程嵌套交互數(shù)據(jù) 259 12.2.4 通過JSON發(fā)送消息 262 12.3 執(zhí)行大計算量任務(wù) 263 12.3.1 創(chuàng)建Worker 264 12.3.2 使用Web Workers API執(zhí)行大計算量任務(wù) 264 12.4 綜合應(yīng)用——在后臺運(yùn)行耗時較長的運(yùn)算 270 Chapter 13 頁面數(shù)據(jù)離線處理 274 13.1 離線應(yīng)用基礎(chǔ) 274 13.1.1 manifest文件詳解 274 13.1.2 配置IIS服務(wù)器 275 13.1.3 開發(fā)離線應(yīng)用程序 276 13.2 檢測本地緩存的更新狀態(tài) 278 13.2.1 updateread事件 278 13.2.2 update方法 279 13.2.3 使用swapCache方法 281 13.2.4 可能觸發(fā)的其他事件 283 13.3 檢測在線狀態(tài) 285 13.3.1 使用onLine屬性 285 13.3.2 使用online事件和offline事件 287 13.3.3 開發(fā)一個離線留言系統(tǒng) 289 13.4 綜合應(yīng)用——開發(fā)一個離線式日歷提醒系統(tǒng) 292 Chapter 14 繪制三維圖形圖像 296 14.1 WebGL基礎(chǔ) 296 14.1.1 發(fā)展歷程 296 14.1.2 WebGL和HTML 5的關(guān)系 297 14.1.3 開發(fā)前的準(zhǔn)備 297 14.2 使用WebGL 298 14.2.1 繪制三角形和矩形 298 14.2.2 繪制有顏色的三角形和矩形 302 14.2.3 繪制三維動畫 308 Chapter 15 使用Geolocation API 316 15.1 Geolocation API介紹 316 15.1.1 對瀏覽器的支持情況 316 15.1.2 使用Geolocation API 317 15.2 獲取當(dāng)前地理位置 318 15.3 使用getCurrentPosition()方法 321 15.4 在網(wǎng)頁中使用地圖 323 15.4.1 在網(wǎng)頁中調(diào)用地圖 323 15.4.2 在地圖中顯示當(dāng)前的位置 325 15.4.3 在網(wǎng)頁中居中顯示定位地圖 327 15.4.4 利用百度地圖實(shí)現(xiàn)定位處理 329 15.5 綜合應(yīng)用——在彈出框中顯示定位信息 331 Chapter 16 使用jQTouch框架 335 16.1 jQTouch基礎(chǔ) 335 16.1.1 jQTouch的特點(diǎn) 335 16.1.2 體驗(yàn)jQTouch程序 336 16.2 開始使用jQTouch 340 16.2.1 引入一段jQTouch代碼 340 16.2.2 使用 jQuer 生成動態(tài)數(shù)據(jù) 342 16.2.3 使用jQTouch創(chuàng)建動態(tài)UI 342 16.3 綜合應(yīng)用——使用JQTouch框架開發(fā)動畫網(wǎng)頁 346 Chapter 17 使用Sencha Touch框架 354 17.1 Sencha Touch基礎(chǔ) 354 17.1.1 Sencha Touch簡介 354 17.1.2 Sencha Touch的特性 355 17.1.3 Sencha Touch的優(yōu)勢 355 17.2 搭建Sencha Touch開發(fā)環(huán)境 356 17.2.1 獲取Sencha Touch 356 17.2.2 搭建Eclipse+Sencha Touch開發(fā)環(huán)境 358 17.2.3 調(diào)試Sencha Touch程序 362 17.3 Sencha Touch界面布局 363 17.3.1 Hbox布局（水平布局） 364 17.3.2 VBox布局（垂直布局） 365 17.3.3 Card布局（卡片布局） 365 17.3.4 Fit布局（填充布局） 367 17.3.5 Docking（?？浚?nbsp;367 17.4 綜合應(yīng)用——實(shí)現(xiàn)一個手機(jī)通訊錄 368 Chapter 18 使用Node.js 378 18.1 Node.js的特性 378 18.2 搭建Node.js開發(fā)環(huán)境 378 18.2.1 獲取并安裝Node.js 379 18.2.2 第一段Node.js程序 381 18.3 Node.js基本配置 382 18.3.1 創(chuàng)建HTTP服務(wù)器 382 18.3.2 配置模塊系統(tǒng) 383 18.4 Node.js的基本語法 385 18.4.1 Node.js 事件 385 18.4.2 Node.js 函數(shù) 387 18.4.3 Node.js 路由 388 18.4.4 Node.js 全局對象 390 18.5 綜合應(yīng)用——使用Node.js+Socket實(shí)現(xiàn)聊天室系統(tǒng) 393 Chapter 19 記事本系統(tǒng) 401 19.1 系統(tǒng)功能分析 401 19.2 系統(tǒng)模塊劃分 402 19.3 構(gòu)建jQuer Mobie平臺 402 19.4 頁面實(shí)現(xiàn) 402 19.4.1 實(shí)現(xiàn)系統(tǒng)首頁 403 19.4.2 實(shí)現(xiàn)記事本類別列表頁面 405 19.4.3 實(shí)現(xiàn)記事本列表頁面 406 19.4.4 實(shí)現(xiàn)記事本詳情和刪除頁面 408 19.4.5 實(shí)現(xiàn)記事本修改頁面 409 19.4.6 實(shí)現(xiàn)添加記事本頁面 411 19.5 系統(tǒng)樣式文件 413 Chapter 20 Android版的電話管理系統(tǒng) 415 20.1 需求分析 415 20.1.1 產(chǎn)生背景 415 20.1.2 功能分析 415 20.2 創(chuàng)建Android工程 417 20.3 實(shí)現(xiàn)系統(tǒng)主界面 417 20.4 實(shí)現(xiàn)信息查詢模塊 419 20.5 實(shí)現(xiàn)系統(tǒng)管理模塊 421 20.6 實(shí)現(xiàn)信息添加模塊 424 20.7 實(shí)現(xiàn)信息修改模塊 427 20.8 實(shí)現(xiàn)信息刪除模塊和更新模塊 430Chapter 1 移動Web開發(fā)基礎(chǔ) 1 1.1 認(rèn)識網(wǎng)頁和網(wǎng)站 1 1.1.1 網(wǎng)頁 1 1.1.2 網(wǎng)站 2 1.2 網(wǎng)頁的基本構(gòu)成元素 2 1.3 制作網(wǎng)頁的基本流程 4 1.4 制作網(wǎng)站的基本流程 5 1.4.1 網(wǎng)站發(fā)展趨勢 5 1.4.2 網(wǎng)站制作流程 6 1.4.3 網(wǎng)站設(shè)計原則 7 1.5 Web標(biāo)準(zhǔn)開發(fā)技術(shù)介紹 7 1.5.1 結(jié)構(gòu)化標(biāo)準(zhǔn)語言 7 1.5.2 表現(xiàn)性標(biāo)準(zhǔn)語言 8 1.5.3 行為標(biāo)準(zhǔn) 8 1.6 移動Web開發(fā)概覽 9 1.6.1 主流移動平臺介紹 9 1.6.2 移動Web的特點(diǎn) 11 1.6.3 設(shè)計移動網(wǎng)站時需要考慮的問題 12 1.6.4 主流的移動設(shè)備屏幕的分辨率 12 1.6.5 使用標(biāo)準(zhǔn)的HTML、CSS和JavaScript技術(shù) 13 1.7 移動Web開發(fā)技術(shù)必備 13 Chapter 2 搭建移動Web開發(fā)環(huán)境 15 2.1 安裝Dreamweaver CS6 15 2.2 安裝jQuer Mobile 19 2.2.1 下載jQuer Mobile插件 19 2.2.2 使用URL方式加載插件文件 20 2.3 搭建PhoneGap開發(fā)環(huán)境 20 2.3.1 準(zhǔn)備工作 20 2.3.2 獲得PhoneGap開發(fā)包 21 2.4 搭建測試環(huán)境 25 Chapter 3 移動Web開發(fā)的準(zhǔn)備工作 27 3.1 創(chuàng)建通用網(wǎng)站的實(shí)現(xiàn)流程 27 3.1.1 確定應(yīng)用程序類型 27 3.1.2 使用CSS改善HTML外觀 28 3.1.3 加入移動meta標(biāo)簽 30 3.2 將站點(diǎn)升級至HTML 5 31 3.2.1 確定何時升級和升級的具體方式 31 3.2.2 升級到HTML 5的步驟 33 3.2.3 將HTML 5特性作為額外內(nèi)容添加至網(wǎng)站 33 3.2.4 使用HTML 5為移動Web提供的服務(wù) 34 3.3 將Web程序遷移到移動設(shè)備 34 3.3.1 選擇Web編輯器 34 3.3.2 測試應(yīng)用程序 35 3.3.3 為移動設(shè)備調(diào)整可視化的設(shè)計 35 3.3.4 HTML 5及CSS 3檢測 36 3.4 搭建Android開發(fā)環(huán)境 38 3.4.1 安裝Android SDK的系統(tǒng)要求 38 3.4.2 安裝JDK 38 3.4.3 獲取并安裝Eclipse和Android SDK 42 3.4.4 安裝ADT 45 3.4.5 設(shè)定Android SDK Home 47 3.4.6 驗(yàn)證開發(fā)環(huán)境 48 3.4.7 創(chuàng)建并管理Android虛擬設(shè)備（AVD） 49 3.4.8 啟動AVD模擬器 50 3.5 搭建iOS開發(fā)環(huán)境 51 3.5.1 開發(fā)前的準(zhǔn)備——加入iOS開發(fā)團(tuán)隊(duì) 52 3.5.2 安裝Xcode 54 3.5.3 Xcode介紹 54 3.5.4 下載并安裝Xcode 55 3.5.5 創(chuàng)建一個Xcode項(xiàng)目并啟動模擬器 58 Chapter 4 HTML基礎(chǔ) 62 4.1 HTML初步 62 4.1.1 HTML概述 62 4.1.2 HTML基本結(jié)構(gòu) 63 4.2 HTML標(biāo)記詳解 64 4.2.1 標(biāo)題文字標(biāo)記＜h＞ 64 4.2.2 文本文字標(biāo)記＜font＞ 65 4.2.3 字型設(shè)置標(biāo)記 66 4.2.4 段落標(biāo)記＜p＞ 67 4.2.5 換行標(biāo)記＜br＞ 68 4.2.6 超鏈接標(biāo)記＜a＞ 68 4.2.7 設(shè)置背景圖片標(biāo)記＜bod background＞ 70 4.2.8 插入圖片標(biāo)記＜img＞ 70 4.2.9 列表標(biāo)記 71 4.2.10 表格標(biāo)記＜table＞、＜tr＞、＜th＞和＜td＞ 75 4.3 綜合應(yīng)用——制作一個簡單網(wǎng)頁 76 Chapter 5 HTML 5在移動設(shè)備中 80 5.1 把握未來的風(fēng)向標(biāo) 80 5.2 用HTML 5設(shè)計移動網(wǎng)站前的準(zhǔn)備 81 5.2.1 為移動網(wǎng)站準(zhǔn)備專用的域名 81 5.2.2 準(zhǔn)備測試環(huán)境 81 5.3 全新的HTML 5 82 5.4 設(shè)置網(wǎng)頁頭部元素 83 5.4.1 設(shè)置文檔類型 83 5.4.2 設(shè)置所有鏈接規(guī)定默認(rèn)地址或默認(rèn)目標(biāo) 84 5.4.3 鏈接標(biāo)簽 84 5.4.4 設(shè)置有關(guān)頁面的元信息 86 5.4.5 定義客戶端腳本 86 5.4.6 定義HTML文檔的樣式信息 87 5.4.7 設(shè)置頁面標(biāo)題 88 5.5 設(shè)置頁面正文 89 5.6 注釋 90 5.7 和頁面結(jié)構(gòu)相關(guān)的新元素 91 5.7.1 定義區(qū)段的標(biāo)簽 91 5.7.2 定義獨(dú)立內(nèi)容的標(biāo)簽 91 5.7.3 定義導(dǎo)航鏈接標(biāo)簽 92 5.7.4 定義其所處內(nèi)容之外的內(nèi)容 93 5.7.5 定義頁腳內(nèi)容的標(biāo)簽 93 5.8 在網(wǎng)頁中顯示聯(lián)系信息 94 5.9 自動隱藏或顯示網(wǎng)頁中的文字 95 5.10 綜合應(yīng)用——自動檢測輸入的拼音是否正確 96 Chapter 6 CSS基礎(chǔ) 98 6.1 體驗(yàn)CSS的功能 98 6.2 基本語法 99 6.3 使用選擇符 100 6.3.1 選擇符的種類 100 6.3.2 實(shí)戰(zhàn)演練——使用id選擇符設(shè)置文字顏色 102 6.4 CSS屬性 103 6.5 幾個常用值 104 6.5.1 顏色單位 104 6.5.2 長度單位 106 6.5.3 百分比值 107 6.5.4 URL統(tǒng)一資源定位符 107 6.5.5 URL默認(rèn)值 108 6.6 在網(wǎng)頁中使用CSS 108 6.6.1 頁面調(diào)用CSS方式 108 6.6.2 通用優(yōu)先級實(shí)戰(zhàn) 110 6.6.3 類型選擇符和類選擇符實(shí)戰(zhàn) 112 6.6.4 id選擇符實(shí)戰(zhàn) 113 6.6.5 最近優(yōu)先原則實(shí)戰(zhàn) 114 6.7 CSS的編碼規(guī)范 115 6.7.1 書寫規(guī)范 115 6.7.2 命名規(guī)范 115 6.8 CSS調(diào)試 116 6.8.1 設(shè)計軟件調(diào)試 116 6.8.2 繼承性和默認(rèn)值帶來的問題 117 6.9 綜合應(yīng)用——實(shí)現(xiàn)精致、符合標(biāo)準(zhǔn)的表單頁面 119 Chapter 7 JavaScript腳本語言 121 7.1 JavaScript簡介 121 7.1.1 JavaScript格式 121 7.1.2 一個典型的JavaScript文件 121 7.2 數(shù)據(jù)類型 122 7.2.1 數(shù)據(jù)類型概述 122 7.2.2 JavaScript常量 123 7.2.3 JavaScript變量 123 7.3 表達(dá)式和運(yùn)算符 124 7.3.1 JavaScript表達(dá)式 124 7.3.2 JavaScript運(yùn)算符 125 7.4 JavaScript循環(huán)語句 127 7.4.1 if條件語句 127 7.4.2 for循環(huán)語句 130 7.4.3 while循環(huán)語句 131 7.4.4 do…while循環(huán)語句 133 7.4.5 break控制 134 7.4.6 switch循環(huán)語句 134 7.5 JavaScript函數(shù) 134 7.5.1 函數(shù)的構(gòu)成 135 7.5.2 JavaScript常用函數(shù) 136 7.6 JavaScript對象 137 7.6.1 對象基礎(chǔ)知識 137 7.6.2 JavaScript常用對象和方法 139 7.7 JavaScript事件 142 7.7.1 JavaScript常用事件 142 7.7.2 事件處理程序 143 7.8 JavaScript窗口對象 144 7.8.1 窗口對象 144 7.8.2 窗口對象的事件驅(qū)動 145 7.8.3 窗口對象中的屬性 145 7.8.4 窗口對象的方法 145 7.8.5 JavaScript窗口對象的應(yīng)用 146 7.9 JavaScript框架對象 148 Chapter 8 使用jQuer Mobile 框架 150 8.1 jQuer Mobile簡介 150 8.1.1 jQuer的優(yōu)勢 150 8.1.2 jQuer Mobile的特點(diǎn) 151 8.1.3 jQuer Mobile對瀏覽器的支持 151 8.1.4 jQuer Mobile對移動平臺的支持 152 8.2 jQuer Mobile的四大優(yōu)勢 153 8.2.1 跨所有移動平臺的統(tǒng)一UI 153 8.2.2 簡化的標(biāo)記驅(qū)動的開發(fā) 153 8.2.3 漸進(jìn)式增強(qiáng) 153 8.2.4 響應(yīng)式設(shè)計 154 8.3 jQuer Mobile語法基礎(chǔ) 154 8.3.1 使用基本框架 155 8.3.2 多頁面模板 158 8.3.3 設(shè)置內(nèi)部頁面的頁面標(biāo)題 160 8.3.4 設(shè)置外部頁面鏈接 161 8.3.5 實(shí)現(xiàn)頁面后退鏈接 161 8.3.6 使用Ajax修飾導(dǎo)航 162 8.3.7 使用函數(shù)changePage() 165 8.4 預(yù)加載 166 8.5 頁面緩存 167 8.6 頁面腳本 169 Chapter 9 使用PhoneGap 171 9.1 PhoneGap基礎(chǔ) 171 9.1.1 產(chǎn)生背景 171 9.1.2 PhoneGap的發(fā)展歷程 172 9.1.3 PhoneGap移動Web開發(fā)的步驟 172 9.2 PhoneGap API詳解 173 9.2.1 應(yīng)用API 174 9.2.2 通知API 175 9.2.3 設(shè)備API 177 9.2.4 網(wǎng)絡(luò)連接API 178 9.2.5 加速計API 180 9.2.6 地理位置API 183 9.2.7 指南針API 185 9.2.8 照相機(jī)API 187 9.2.9 Capture采集 191 9.2.10 Media API 193 9.3 綜合應(yīng)用——使用Media構(gòu)造一個播放器 194 Chapter 10 開發(fā)移動設(shè)備網(wǎng)頁 197 10.1 編寫第一個適用于Android系統(tǒng)的網(wǎng)頁 197 10.1.1 控制頁面的縮放 200 10.1.2 添加CSS樣式 201 10.1.3 添加JavaScript 204 10.2 添加Ajax特效 206 10.3 打造一個iOS+jQuer Mobile+PhoneGap程序 212 10.4 綜合演練——打造一個Android+jQuer Mobile+ PhoneGap程序 214 10.4.1 建立一個基于Web的Android應(yīng)用 215 10.4.2 添加Web內(nèi)容 216 10.4.3 利用PhoneGap封裝成移動Web應(yīng)用 217 10.4.4 修改權(quán)限文件 219 Chapter 11 Web Sockets實(shí)時數(shù)據(jù)處理 221 11.1 安裝jWebSocket服務(wù)器 221 11.2 實(shí)現(xiàn)跨文檔傳輸數(shù)據(jù) 222 11.3 使用WebSocket傳送數(shù)據(jù) 225 11.3.1 使用Web Sockets API的方法 226 11.3.2 實(shí)戰(zhàn)演練 226 11.4 處理JSON對象 229 11.5 jWebSocket框架 232 11.5.1 jWebSocket框架的構(gòu)成 232 11.5.2 創(chuàng)建jWebSocket服務(wù)器端的偵聽器 232 11.6 jWebSocket令牌詳解 240 11.6.1 令牌的格式 240 11.6.2 令牌的常用術(shù)語 240 11.6.3 系統(tǒng)令牌詳解 241 11.7 綜合應(yīng)用——使用jWebSocketTest框架進(jìn)行通信 247 Chapter 12 Web Workers通信處理 251 12.1 Web Workers API基礎(chǔ) 251 12.1.1 使用HTML5 Web Workers API 251 12.1.2 需要使用.js 文件 252 12.1.3 與 Web Worker 進(jìn)行雙向通信 252 12.2 Worker線程處理 254 12.2.1 使用Worker處理線程 255 12.2.2 使用線程傳遞JSON對象 258 12.2.3 使用線程嵌套交互數(shù)據(jù) 259 12.2.4 通過JSON發(fā)送消息 262 12.3 執(zhí)行大計算量任務(wù) 263 12.3.1 創(chuàng)建Worker 264 12.3.2 使用Web Workers API執(zhí)行大計算量任務(wù) 264 12.4 綜合應(yīng)用——在后臺運(yùn)行耗時較長的運(yùn)算 270 Chapter 13 頁面數(shù)據(jù)離線處理 274 13.1 離線應(yīng)用基礎(chǔ) 274 13.1.1 manifest文件詳解 274 13.1.2 配置IIS服務(wù)器 275 13.1.3 開發(fā)離線應(yīng)用程序 276 13.2 檢測本地緩存的更新狀態(tài) 278 13.2.1 updateread事件 278 13.2.2 update方法 279 13.2.3 使用swapCache方法 281 13.2.4 可能觸發(fā)的其他事件 283 13.3 檢測在線狀態(tài) 285 13.3.1 使用onLine屬性 285 13.3.2 使用online事件和offline事件 287 13.3.3 開發(fā)一個離線留言系統(tǒng) 289 13.4 綜合應(yīng)用——開發(fā)一個離線式日歷提醒系統(tǒng) 292 Chapter 14 繪制三維圖形圖像 296 14.1 WebGL基礎(chǔ) 296 14.1.1 發(fā)展歷程 296 14.1.2 WebGL和HTML 5的關(guān)系 297 14.1.3 開發(fā)前的準(zhǔn)備 297 14.2 使用WebGL 298 14.2.1 繪制三角形和矩形 298 14.2.2 繪制有顏色的三角形和矩形 302 14.2.3 繪制三維動畫 308 Chapter 15 使用Geolocation API 316 15.1 Geolocation API介紹 316 15.1.1 對瀏覽器的支持情況 316 15.1.2 使用Geolocation API 317 15.2 獲取當(dāng)前地理位置 318 15.3 使用getCurrentPosition()方法 321 15.4 在網(wǎng)頁中使用地圖 323 15.4.1 在網(wǎng)頁中調(diào)用地圖 323 15.4.2 在地圖中顯示當(dāng)前的位置 325 15.4.3 在網(wǎng)頁中居中顯示定位地圖 327 15.4.4 利用百度地圖實(shí)現(xiàn)定位處理 329 15.5 綜合應(yīng)用——在彈出框中顯示定位信息 331 Chapter 16 使用jQTouch框架 335 16.1 jQTouch基礎(chǔ) 335 16.1.1 jQTouch的特點(diǎn) 335 16.1.2 體驗(yàn)jQTouch程序 336 16.2 開始使用jQTouch 340 16.2.1 引入一段jQTouch代碼 340 16.2.2 使用 jQuer 生成動態(tài)數(shù)據(jù) 342 16.2.3 使用jQTouch創(chuàng)建動態(tài)UI 342 16.3 綜合應(yīng)用——使用JQTouch框架開發(fā)動畫網(wǎng)頁 346 Chapter 17 使用Sencha Touch框架 354 17.1 Sencha Touch基礎(chǔ) 354 17.1.1 Sencha Touch簡介 354 17.1.2 Sencha Touch的特性 355 17.1.3 Sencha Touch的優(yōu)勢 355 17.2 搭建Sencha Touch開發(fā)環(huán)境 356 17.2.1 獲取Sencha Touch 356 17.2.2 搭建Eclipse+Sencha Touch開發(fā)環(huán)境 358 17.2.3 調(diào)試Sencha Touch程序 362 17.3 Sencha Touch界面布局 363 17.3.1 Hbox布局（水平布局） 364 17.3.2 VBox布局（垂直布局） 365 17.3.3 Card布局（卡片布局） 365 17.3.4 Fit布局（填充布局） 367 17.3.5 Docking（停靠） 367 17.4 綜合應(yīng)用——實(shí)現(xiàn)一個手機(jī)通訊錄 368 Chapter 18 使用Node.js 378 18.1 Node.js的特性 378 18.2 搭建Node.js開發(fā)環(huán)境 378 18.2.1 獲取并安裝Node.js 379 18.2.2 第一段Node.js程序 381 18.3 Node.js基本配置 382 18.3.1 創(chuàng)建HTTP服務(wù)器 382 18.3.2 配置模塊系統(tǒng) 383 18.4 Node.js的基本語法 385 18.4.1 Node.js 事件 385 18.4.2 Node.js 函數(shù) 387 18.4.3 Node.js 路由 388 18.4.4 Node.js 全局對象 390 18.5 綜合應(yīng)用——使用Node.js+Socket實(shí)現(xiàn)聊天室系統(tǒng) 393 Chapter 19 記事本系統(tǒng) 401 19.1 系統(tǒng)功能分析 401 19.2 系統(tǒng)模塊劃分 402 19.3 構(gòu)建jQuer Mobie平臺 402 19.4 頁面實(shí)現(xiàn) 402 19.4.1 實(shí)現(xiàn)系統(tǒng)首頁 403 19.4.2 實(shí)現(xiàn)記事本類別列表頁面 405 19.4.3 實(shí)現(xiàn)記事本列表頁面 406 19.4.4 實(shí)現(xiàn)記事本詳情和刪除頁面 408 19.4.5 實(shí)現(xiàn)記事本修改頁面 409 19.4.6 實(shí)現(xiàn)添加記事本頁面 411 19.5 系統(tǒng)樣式文件 413 Chapter 20 Android版的電話管理系統(tǒng) 415 20.1 需求分析 415 20.1.1 產(chǎn)生背景 415 20.1.2 功能分析 415 20.2 創(chuàng)建Android工程 417 20.3 實(shí)現(xiàn)系統(tǒng)主界面 417 20.4 實(shí)現(xiàn)信息查詢模塊 419 20.5 實(shí)現(xiàn)系統(tǒng)管理模塊 421 20.6 實(shí)現(xiàn)信息添加模塊 424 20.7 實(shí)現(xiàn)信息修改模塊 427 20.8 實(shí)現(xiàn)信息刪除模塊和更新模塊 430