HTML5移動(dòng)Web開發(fā)技術(shù)

前言
第1章移動(dòng)互聯(lián)網(wǎng)時(shí)代HTML5概述
1.1移動(dòng)互聯(lián)網(wǎng)Web技術(shù)發(fā)展
1.2HTML5概述
1.2.1HTML5的誕生和發(fā)展
1.2.2HTML5新特性
1.2.3跨越瀏覽器的HTML5
1.3HTML5在移動(dòng)開發(fā)中的應(yīng)用
1.3.1Web前端開發(fā)技術(shù)簡(jiǎn)介
1.3.2移動(dòng)Web應(yīng)用發(fā)展
1.3.3HTML5移動(dòng)端開發(fā)前景和優(yōu)勢(shì)
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1使用瀏覽器下載和查看網(wǎng)頁(yè)
源代碼
實(shí)驗(yàn)2快速制作簡(jiǎn)單網(wǎng)頁(yè)
第2章移動(dòng)開發(fā)工具和開發(fā)框架
2.1使用HTML5開發(fā)移動(dòng)端應(yīng)用
程序
2.2PC瀏覽器中模擬移動(dòng)開發(fā)與
測(cè)試
2.3主流移動(dòng)開發(fā)工具
2.3.1HBuilder
2.3.2Sublime Text
2.3.3Atom
2.3.4WebStorm
2.3.5Visual Studio Code
2.4HTML5移動(dòng)Web開發(fā)框架
2.4.1jQuery Mobile
2.4.2Sencha Touch
2.4.3Junior
2.4.4其他HTML5移動(dòng)Web開發(fā)
框架
2.5案例：使用HBuilder框架設(shè)計(jì)
精美窗體
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1使用HBuilder創(chuàng)建MUI框架
頁(yè)面
實(shí)驗(yàn)2用jQuery Mobile框架實(shí)現(xiàn)框架
抽屜布局效果
第3章移動(dòng)開發(fā)常用的HTML5
標(biāo)簽
3.1HTML5文件基本標(biāo)記
3.1.1頭部元素
3.1.2標(biāo)題元素
3.1.3元信息標(biāo)記
3.1.4頁(yè)面主體
3.1.5頁(yè)面注釋標(biāo)記
3.2頁(yè)面主體標(biāo)簽
3.2.1文字格式
3.2.2跨越瀏覽器的HTML5
3.3列表
3.3.1有序列表
3.3.2無(wú)序列表
3.3.3定義列表
3.3.4菜單列表
3.3.5目錄列表
3.4層標(biāo)記
3.4.1div標(biāo)簽
3.4.2iframe標(biāo)簽
3.4.3layer和ilayer標(biāo)簽
3.5表格
3.5.1標(biāo)題和表頭
3.5.2表格的基本屬性
3.5.3表格樣式的設(shè)定
3.6多媒體
3.6.1audio標(biāo)簽
3.6.2video標(biāo)簽
3.7圖像效果
3.7.1圖像的基本格式
3.7.2圖像屬性
3.7.3圖像文字和鏈接
3.8文件與拖放
3.8.1file對(duì)象選擇文件
3.8.2圖像屬性blob接口獲取文件的
類型與大小
3.8.3FileReader接口
3.8.4拖放API
3.8.5實(shí)現(xiàn)拖放的步驟
3.9案例：實(shí)現(xiàn)購(gòu)物車功能
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1列表——簡(jiǎn)單的ul標(biāo)簽小
應(yīng)用
實(shí)驗(yàn)2iframe——使用iframe實(shí)現(xiàn)簡(jiǎn)單
導(dǎo)航欄切換效果
實(shí)驗(yàn)3將自己的課表顯示在頁(yè)面上
第4章HTML5高級(jí)開發(fā)標(biāo)簽
4.1HTML5 canvas概述
4.2canvas標(biāo)簽
4.2.1繪制矩形
4.2.2使用路徑繪制圖形
4.2.3使用arc繪制弧形
4.2.4填充及填充樣式
4.2.5繪制曲線
4.2.6canvas變換及文本
4.2.7漸變
4.3Geolocation（地理定位）
4.4HTML5主要新增標(biāo)簽
4.4.1語(yǔ)義化標(biāo)記
4.4.2input新增屬性
4.4.3button標(biāo)簽
4.4.4HTML5其他新增標(biāo)簽
4.4.5HTML5廢除的元素
4.5案例：創(chuàng)建魔方玩具效果
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1用canvas繪制一個(gè)笑臉圖案
實(shí)驗(yàn)2用canvas實(shí)現(xiàn)簡(jiǎn)單濾鏡效果
第5章HTML5表單設(shè)計(jì)
5.1表單屬性標(biāo)簽
5.2添加類控件
5.2.1文本控件
5.2.2密碼域
5.2.3單選按鈕
5.2.4復(fù)選框
5.2.5普通按鈕
5.2.6提交按鈕
5.2.7重置按鈕
5.3表單輸出元素和驗(yàn)證
5.3.1表單的輸出元素
5.3.2表單驗(yàn)證
5.4案例：E-M在線注冊(cè)應(yīng)用
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1CRM系統(tǒng)注冊(cè)頁(yè)面實(shí)現(xiàn)
實(shí)驗(yàn)2QQ登錄系統(tǒng)實(shí)現(xiàn)
第6章CSS3樣式
6.1CSS概述
6.2CSS的屬性和背景
6.2.1CSS屬性
6.2.2CSS3 背景
6.3選擇器
6.4CSS的定位
6.5頁(yè)面設(shè)計(jì)案例
6.6案例：DIV+CSS精美窗口
設(shè)計(jì)
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1創(chuàng)建手風(fēng)琴效果
實(shí)驗(yàn)2仿九宮格排列的按鈕組
第7章JavaScript基礎(chǔ)
7.1JavaScript概述
7.2JS基礎(chǔ)元素和功能
7.2.1JS注釋
7.2.2JS輸出
7.2.3JS運(yùn)算符
7.2.4流程控制語(yǔ)句
7.2.5JS循環(huán)語(yǔ)句
7.2.6JS錯(cuò)誤和驗(yàn)證
7.3JS函數(shù)與內(nèi)置對(duì)象
7.3.1JS函數(shù)
7.3.2JS對(duì)象
7.4JS窗口對(duì)象
7.4.1window對(duì)象
7.4.2document對(duì)象
7.4.3timing對(duì)象
7.4.4navigator對(duì)象
7.4.5history對(duì)象
7.4.6location對(duì)象
7.5表單交互
7.6Cookie存儲(chǔ)信息
7.7案例：在線書店購(gòu)物車
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1JS編程環(huán)境及代碼調(diào)試方法
實(shí)驗(yàn)2用JS實(shí)現(xiàn)在線電子商務(wù)購(gòu)物
第8章移動(dòng)框架jQuery Mobile
8.1實(shí)現(xiàn)一個(gè)Hello World
8.2UI頁(yè)面設(shè)計(jì)
8.2.1頁(yè)面與視圖
8.2.2基本控件
8.2.3列表
8.2.4工具欄
8.3動(dòng)態(tài)事件
8.3.1表單實(shí)現(xiàn)
8.3.2實(shí)現(xiàn)的工具和方法
8.3.3Event事件
8.4案例：唱片購(gòu)買
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1基于jQuery Mobile的簡(jiǎn)單的
記事本
實(shí)驗(yàn)2基于jQuery Mobile的全鍵盤
界面
第9章HBuilder開發(fā)工具
9.1移動(dòng)開發(fā)工具概述
9.2實(shí)現(xiàn)一個(gè)Hello World程序
9.3MUI框架實(shí)現(xiàn)
9.3.1主要的UI組件
9.3.2窗口管理
9.3.3事件管理
9.3.4刷新加載
9.4設(shè)計(jì)自己的HBuild程序
9.4.1需求分析
9.4.2App設(shè)計(jì)
9.5案例：使用AJAX實(shí)現(xiàn)App與
服務(wù)器之間的交互
本章小結(jié)
實(shí)踐與練習(xí)
實(shí)驗(yàn)指導(dǎo)
實(shí)驗(yàn)1掌握MUI框架的實(shí)現(xiàn)及其相應(yīng)
組件的功能
實(shí)驗(yàn)2設(shè)計(jì)App，完善用戶體驗(yàn)
第10章綜合實(shí)例——C2C交易平臺(tái)
前端設(shè)計(jì)
10.1需求分析
10.2系統(tǒng)功能模塊設(shè)計(jì)
10.3開發(fā)環(huán)境
10.4前端UI設(shè)計(jì)
10.4.1材料準(zhǔn)備
10.4.2項(xiàng)目準(zhǔn)備
10.4.3移動(dòng)端設(shè)計(jì)
10.4.4流程設(shè)計(jì)
10.4.5商品展示模塊
10.4.6購(gòu)物車設(shè)計(jì)
10.4.7登錄模塊
10.4.8訂單功能模塊
10.4.9聯(lián)系功能模塊
本章小結(jié)