HTML5 App應(yīng)用開(kāi)發(fā)教程

目錄


第1章HTML5 App應(yīng)用開(kāi)發(fā)概述

1.1HTML5介紹

1.1.1終將失敗的Flash

1.1.2Web移動(dòng)應(yīng)用的未來(lái)

1.2HTML5新特性

1.3擁抱HTML5

1.4HTML5 App的發(fā)展

1.5HTML5 App與原生App的比較

1.6HTML5 App開(kāi)發(fā)環(huán)境搭建

1.6.1開(kāi)發(fā)工具的安裝

1.6.2最接近原生App體驗(yàn)的MUI框架

1.6.3HTML5+應(yīng)用介紹

1.6.4流應(yīng)用介紹

1.7開(kāi)發(fā)第一個(gè)HTML5 App

1.7.1練習(xí)： HelloWorld程序

1.7.2打包過(guò)程

小結(jié)

習(xí)題

第2章HTML5頁(yè)面基礎(chǔ)

2.1HTML簡(jiǎn)介

2.1.1標(biāo)簽

2.1.2標(biāo)簽的屬性

2.1.3注釋標(biāo)簽

2.2HTML5文檔基本格式

2.3布局div標(biāo)簽

2.4文本控制標(biāo)簽

2.4.1標(biāo)題h標(biāo)簽

2.4.2段落p標(biāo)簽

2.4.3水平線(xiàn)hr標(biāo)簽

2.4.4換行br標(biāo)簽

2.4.5特殊字符標(biāo)記

2.4.6修飾span標(biāo)簽

2.5圖像img標(biāo)簽

2.6超鏈接a標(biāo)簽

2.7列表標(biāo)簽

2.7.1無(wú)序列表ul標(biāo)簽

2.7.2有序列表ol標(biāo)簽

2.8語(yǔ)義化標(biāo)簽

2.9頁(yè)面交互性標(biāo)簽

2.9.1細(xì)節(jié)展示details和summary標(biāo)簽

2.9.2進(jìn)度條progess標(biāo)簽

2.10表格標(biāo)簽

2.11表單的應(yīng)用

2.11.1表單form標(biāo)簽

2.11.2各種input輸入標(biāo)簽

2.11.3input標(biāo)簽的其他屬性

2.11.4其他表單標(biāo)簽

2.11.5實(shí)例： 注冊(cè)表單

2.12移動(dòng)開(kāi)發(fā)中meta標(biāo)簽的應(yīng)用

小結(jié)

習(xí)題

第3章CSS樣式設(shè)計(jì)

3.1CSS簡(jiǎn)介

3.2CSS核心基礎(chǔ)

3.2.1CSS樣式規(guī)則

3.2.2CSS中的單位和顏色

3.2.3在HTML文檔中應(yīng)用CSS

3.3CSS選擇器

3.3.1基礎(chǔ)選擇器

3.3.2其他選擇器

3.4尺寸屬性

3.5文本樣式屬性

3.6CSS高級(jí)特性

3.6.1繼承性

3.6.2CSS層疊性和優(yōu)先級(jí)

3.6.3Chrome調(diào)試CSS

3.7背景屬性

3.7.1設(shè)置背景顏色

3.7.2設(shè)置背景圖片

3.8邊框?qū)傩?

3.9CSS盒子模型

3.9.1內(nèi)填充屬性

3.9.2外邊距屬性

3.9.3boxsizing屬性

3.10浮動(dòng)和定位

3.10.1浮動(dòng)

3.10.2定位

3.10.3塊元素與行內(nèi)元素

3.11CSS動(dòng)畫(huà)效果

3.11.1過(guò)渡

3.11.22D及3D變換

3.11.3動(dòng)畫(huà)控制

3.12其他一些常用的CSS屬性

3.13移動(dòng)設(shè)備的適配

3.14實(shí)例

3.14.1注冊(cè)表單樣式美化

3.14.2旅游App頁(yè)面

小結(jié)

習(xí)題

第4章JavaScript編程基礎(chǔ)

4.1JavaScript介紹

4.2使用JavaScript

4.2.1在頁(yè)面中插入代碼

4.2.2使用js文件

4.3JavaScript的基礎(chǔ)語(yǔ)法

4.3.1數(shù)據(jù)類(lèi)型

4.3.2變量定義

4.3.3數(shù)據(jù)類(lèi)型的轉(zhuǎn)換

4.3.4代碼注釋

4.3.5運(yùn)算符

4.3.6常用語(yǔ)句

4.4函數(shù)

4.4.1函數(shù)定義及調(diào)用

4.4.2變量的作用域

4.4.3函數(shù)重載

4.4.4函數(shù)的返回值

4.4.5匿名函數(shù)

4.5JavaScript在Chrome中的調(diào)試

4.5.1在控制臺(tái)輸出

4.5.2斷點(diǎn)調(diào)試

4.6JavaScript對(duì)象基礎(chǔ)

4.6.1Object對(duì)象

4.6.2內(nèi)置對(duì)象

4.6.3自定義類(lèi)或?qū)ο?

4.7JavaScript處理JSON

4.7.1JSON格式結(jié)構(gòu)簡(jiǎn)介

4.7.2JSON序列化與反序列化

小結(jié)

習(xí)題

第5章JavaScript交互編程

5.1DOM介紹

5.2使用DOM

5.2.1document對(duì)象

5.2.2查找節(jié)點(diǎn)

5.2.3處理屬性

5.2.4讀取和設(shè)置內(nèi)容

5.2.5創(chuàng)建和操作節(jié)點(diǎn)

5.3DOM的樣式編程

5.3.1className屬性

5.3.2classList對(duì)象

5.3.3style對(duì)象

5.4事件

5.4.1常用的一些事件

5.4.2內(nèi)聯(lián)屬性監(jiān)聽(tīng)事件

5.4.3DOM屬性監(jiān)聽(tīng)事件

5.4.4標(biāo)準(zhǔn)的事件監(jiān)聽(tīng)函數(shù)

5.4.5事件觸發(fā)過(guò)程

5.4.6事件的Event對(duì)象

小結(jié)

習(xí)題

第6章jQuery編程基礎(chǔ)

6.1jQuery介紹

6.2使用jQuery

6.3使用$()函數(shù)

6.4jQuery的自定義選擇器

6.4.1基本過(guò)濾器

6.4.2內(nèi)容過(guò)濾器

6.4.3可見(jiàn)性過(guò)濾器

6.4.4表單選擇器

6.5jQuery對(duì)象與DOM對(duì)象的轉(zhuǎn)換

6.6jQuery對(duì)事件的處理

6.6.1頁(yè)面加載后執(zhí)行

6.6.2jQuery事件監(jiān)聽(tīng)

6.7jQuery遍歷方法

6.7.1遍歷HTML元素對(duì)象

6.7.2遍歷數(shù)組對(duì)象

6.7.3遍歷JSON對(duì)象屬性

6.8jQueryDOM交互

6.8.1操作HTML屬性

6.8.2操作表單元素的值

6.8.3修改節(jié)點(diǎn)內(nèi)容

6.8.4創(chuàng)建和添加HTML元素節(jié)點(diǎn)

6.8.5刪除HTML元素節(jié)點(diǎn)

6.8.6復(fù)制HTML元素節(jié)點(diǎn)

6.8.7修改樣式

6.9jQuery的擴(kuò)展

6.10jQuery插件應(yīng)用介紹

6.11實(shí)例： 記憶翻牌游戲

小結(jié)

習(xí)題

第7章AJAX通信技術(shù)

7.1AJAX技術(shù)介紹

7.2HTTP協(xié)議分析

7.2.1HTTP協(xié)議介紹

7.2.2Fiddler抓包神器

7.2.3HTTP請(qǐng)求與響應(yīng)

7.2.4Fiddler手機(jī)數(shù)據(jù)抓包

7.2.5Fiddler模擬HTTP請(qǐng)求

7.2.6圖片驗(yàn)證碼

7.3XMLHttpRequest對(duì)象

7.3.1使用方法

7.3.2讀取數(shù)據(jù)

7.3.3提交數(shù)據(jù)

7.3.4FormData對(duì)象

7.3.5解析XML數(shù)據(jù)

7.4CORS跨域問(wèn)題

7.5RESTful API介紹

7.6jQuery中的AJAX方法

7.7實(shí)例： 送貨地址管理

小結(jié)

習(xí)題

第8章WebSocket基礎(chǔ)

8.1WebSocket的發(fā)展歷程

8.2HTML5 WebSocket簡(jiǎn)介

8.3WebSocket實(shí)現(xiàn)

8.4實(shí)例： 聊天室

8.4.1WebSocket服務(wù)器端

8.4.2客戶(hù)端實(shí)現(xiàn)

小結(jié)

習(xí)題

第9章播放多媒體

9.1HTML5標(biāo)準(zhǔn)中的音視頻

9.1.1audio標(biāo)簽

9.1.2video標(biāo)簽

9.2audio和video標(biāo)簽的主要屬性

9.3audio對(duì)象和video對(duì)象的API

9.4實(shí)例： 視頻播放器

小結(jié)

習(xí)題

第10章本地存儲(chǔ)

10.1HTML5本地存儲(chǔ)技術(shù)概述

10.2localStorage和sessionStorage

10.2.1檢查瀏覽器的支持

10.2.2相應(yīng)的API

10.3Web SQL數(shù)據(jù)庫(kù)

10.3.1創(chuàng)建或打開(kāi)數(shù)據(jù)庫(kù)

10.3.2執(zhí)行SQL語(yǔ)句

10.4IndexedDB數(shù)據(jù)庫(kù)

10.4.1數(shù)據(jù)庫(kù)初始化

10.4.2對(duì)象存儲(chǔ)空間

10.4.3索引

10.4.4事務(wù)

10.4.5IndexedDB的CRUD操作

10.4.6游標(biāo)

小結(jié)

習(xí)題

第11章Canvas繪圖

11.1Canvas介紹

11.2繪制圖形

11.2.1繪制直線(xiàn)

11.2.2繪制貝塞爾曲線(xiàn)

11.2.3繪制填充

11.2.4使用漸變色

11.2.5繪制矩形

11.2.6繪制圓弧

11.3繪制文字

11.4繪制圖片

11.5擦除

11.6坐標(biāo)變換

11.7像素操作

11.8實(shí)例： 九宮格手勢(shì)解鎖

小結(jié)