HTML 5實(shí)戰(zhàn)

前言
第1章　擁抱html5
　1.1　一個(gè)簡單的html5頁面
　　1.1.1　搭建支持的瀏覽器環(huán)境
　　1.1.2　檢測(cè)瀏覽器是否支持html5標(biāo)記
　　1.1.3　使用html5結(jié)構(gòu)編寫一個(gè)簡單的web頁面
　1.2　html5頁面的特征
　　1.2.1　應(yīng)用全新的html5特征結(jié)構(gòu)化元素
　　1.2.2　使用css文件美化html5新元素
　1.3　本章小結(jié)
第2章　html5中常用的交互元素
　2.1　內(nèi)容交互元素
　　2.1.1　details元素
　　2.1.2　summary元素
　2.2　菜單交互元素
　　2.2.1　menu元素
　　2.2.2　command元素
　2.3　狀態(tài)交互元素
　　2.3.1　progress元素
　　2.3.2　meter元素
　2.4　本章小結(jié)
第3章　html5中的重要元素
　3.1　html根元素
　3.2　文檔元素
　3.3　腳本
　3.4　節(jié)點(diǎn)
　　3.4.1　section元素
　　3.4.2　nav元素
　　3.4.3　hgroup元素
　　3.4.4　address元素
　3.5　分組內(nèi)容
　　3.5.1　ul元素
　　3.5.2　ol元素
　　3.5.3　dl元素
　3.6　文本層次語義
　　3.6.1　time元素
　　3.6.2　mark元素
　　3.6.3　cite元素
　3.7　嵌入內(nèi)容
　　3.7.1　img元素
　　3.7.2　iframe元素
　　3.7.3　object元素
　3.8　公共屬性
　　3.8.1　draggable屬性
　　3.8.2　hidden屬性
　　3.8.3　spellcheck屬性
　　3.8.4　contenteditable屬性
　3.9　本章小結(jié)
第4章　html5中的表單
　4.1　input元素的新增類型
　　4.1.1　email郵件類型
　　4.1.2　url地址類型
　　4.1.3　number數(shù)字類型
　　4.1.4　range數(shù)字滑動(dòng)條
　　4.1.5　date日期類型
　　4.1.6　search搜索類型
　4.2　input元素新增的公用屬性
　　4.2.1　autofocus屬性
　　4.2.2　pattern屬性
　　4.2.3　placeholder屬性
　　4.2.4　required屬性
　4.3　新增表單元素
　　4.3.1　datalist元素
　　4.3.2　output元素
　　4.3.3　keygen元素
　4.4　表單新增的驗(yàn)證方法和屬性
　　4.4.1　checkvalidity顯式驗(yàn)證法
　　4.4.2　使用setcustomvalidity方法修改提示信息
　　4.4.3　表單的novalidate屬性
　4.5　本章小結(jié)
第5章　html5中的文件
　5.1　選擇文件
　　5.1.1　選擇單個(gè)文件
　　5.1.2　選擇多個(gè)文件
　　5.1.3　使用blob接口獲取文件的類型與大小
　　5.1.4　通過類型過濾選擇的文件
　　5.1.5　通過accept屬性過濾選擇文件的類型
　5.2　使用filereader接口讀取文件
　　5.2.1　filereader接口的方法
　　5.2.2　使用readasdataurl方法預(yù)覽圖片
　　5.2.3　使用readastext方法讀取文本文件
　　5.2.4　偵聽filereader接口中的事件
　5.3　使用datatransfer對(duì)象拖放上傳圖片文件
　5.4　文件讀取時(shí)的錯(cuò)誤與異常
　　5.4.1　發(fā)生錯(cuò)誤與異常的條件
　　5.4.2　錯(cuò)誤代碼說明
　5.5　本章小結(jié)
第6章　html5中的視頻和音頻
　6.1　多媒體元素基本屬性
　　6.1.1　元素格式
　　6.1.2　width與height屬性
　　6.1.3　controls屬性
　　6.1.4　poster屬性
　　6.1.5　networkstate屬性
　　6.1.6　error屬性
　　6.1.7　其他屬性
　6.2　多媒體元素常用方法
　　6.2.1　媒體播放時(shí)的方法
　　6.2.2　canplaytype方法
　6.3　多媒體元素重要事件
　　6.3.1　媒體播放事件
　　6.3.2　timeupdate事件
　　6.3.3　其他事件
　6.4　本章小結(jié)
第7章　html5繪圖基礎(chǔ)
　7.1　畫布的基礎(chǔ)知識(shí)
　　7.1.1　canvas元素的基本用法
　　7.1.2　繪制帶邊框矩形
　　7.1.3　繪制漸變圖形
　7.2　在畫布中使用路徑
　　7.2.1　moveto與lineto的用法
　　7.2.2　使用arc方法繪制圓形
　　7.2.3　繪制漸變圓形
　7.3　對(duì)畫布中圖形的操作
　　7.3.1　變換圖形原點(diǎn)坐標(biāo)
　　7.3.2　組合多個(gè)圖形
　　7.3.3　添加圖形陰影
　7.4　處理畫布中的圖像
　　7.4.1　繪制圖像
　　7.4.2　平鋪圖像
　　7.4.3　切割圖像
　　7.4.4　處理像素
　7.5　畫布的其他應(yīng)用
　　7.5.1　繪制文字
　　7.5.2　保存、恢復(fù)及輸出圖形
　　7.5.3　制作簡單的動(dòng)畫
　7.6　本章小結(jié)
第8章　html5中的數(shù)據(jù)存儲(chǔ)
　8.1　webstorage存儲(chǔ)簡介
　　8.1.1　sessionstorage對(duì)象
　　8.1.2　localstorage對(duì)象
　8.2　localstorage詳解
　　8.2.1　清空localstorage數(shù)據(jù)
　　8.2.2　遍歷localstorage數(shù)據(jù)
　　8.2.3　使用json對(duì)象存取數(shù)據(jù)
　　8.2.4　管理localstorage數(shù)據(jù)
　8.3　websql數(shù)據(jù)庫基礎(chǔ)
　　8.3.1　打開與創(chuàng)建數(shù)據(jù)庫
　　8.3.2　執(zhí)行事務(wù)
　　8.3.3　插入數(shù)據(jù)
　　8.3.4　數(shù)據(jù)管理
　8.4　本章小結(jié)
第9章　html5中的離線應(yīng)用
　9.1　離線應(yīng)用程序
　　9.1.1　manifest文件簡介
　　9.1.2　配置iis服務(wù)器
　　9.1.3　離線應(yīng)用的開發(fā)過程
　9.2　本地緩存的更新及狀態(tài)檢測(cè)
　　9.2.1　updateready事件
　　9.2.2　update方法
　　9.2.3　swapcache方法
　　9.2.4　更新本地緩存時(shí)觸發(fā)的其他事件
　9.3　檢測(cè)在線狀態(tài)
　　9.3.1　online屬性
　　9.3.2　online與offline事件
　　9.3.3　離線數(shù)據(jù)交互應(yīng)用開發(fā)過程
　9.4　本章小結(jié)
第10章　html5中的其他應(yīng)用型api
　10.1　websocketsapi
　　10.1.1　postmessage方法
　　10.1.2　使用websocket傳送數(shù)據(jù)
　　10.1.3　使用websocket傳送json對(duì)象
　10.2　geolocationapi
　　10.2.1　使用getcurrentposition方法獲取當(dāng)前地理位置
　　10.2.2　使用google地圖鎖定位置
　10.3　webworkersapi
　　10.3.1　worker對(duì)象處理線程
　　10.3.2　使用線程傳遞json對(duì)象
　　10.3.3　使用線程嵌套交互數(shù)據(jù)
　10.4　本章小結(jié)
第11章　html5中元素的拖放
　11.1　拖放基礎(chǔ)
　　11.1.1　使用javascript代碼實(shí)現(xiàn)拖放
　　11.1.2　在html5中實(shí)現(xiàn)拖放時(shí)觸發(fā)的事件
　11.2　datatransfer對(duì)象應(yīng)用詳解
　　11.2.1　使用setdata與getdata方法存入與讀取拖放數(shù)據(jù)
　　11.2.2　使用setdragimage方法設(shè)置拖放圖標(biāo)
　　11.2.3　使用effectallowed與dropeffect屬性設(shè)置拖放效果
　11.3　拖放應(yīng)用實(shí)戰(zhàn)
　　11.3.1　購物車的實(shí)現(xiàn)
　　11.3.2　相冊(cè)的管理
　11.4　本章小結(jié)
實(shí)例1-1　檢測(cè)瀏覽器是否支持html5
實(shí)例1-2　hello,world頁面的實(shí)現(xiàn)
實(shí)例1-3　頁面分欄實(shí)現(xiàn)
實(shí)例1-4　樣式化頁面實(shí)現(xiàn)
實(shí)例2-1　交互元素[details]的使用
實(shí)例2-2　用腳本控制交互元素[details]的使用
實(shí)例2-3　交互元素[summary]與[details]的結(jié)合使用
實(shí)例2-4　交互元素[menu]的使用
實(shí)例2-5　交互元素[command]與[menu]的結(jié)合使用
實(shí)例2-6　交互元素[progress]的使用
實(shí)例2-7　交互元素[meter]的使用
實(shí)例3-1　元素[html]的使用
實(shí)例3-2　元素[head]的使用
實(shí)例3-3　元素[script]與[noscript]的使用
實(shí)例3-4　元素[ol]的使用
實(shí)例3-5　元素[mark]的使用
實(shí)例3-6　元素[cite]的使用
實(shí)例3-7　公共屬性draggable的使用
實(shí)例3-8　公共屬性hidden的使用
實(shí)例3-9　公共屬性spellcheck的使用
實(shí)例3-10　公共屬性contenteditable的使用
實(shí)例4-1　email類型的[input]元素的使用
實(shí)例4-2　url類型的[input]元素的使用
實(shí)例4-3　number類型的[input]元素的使用
實(shí)例4-4　range類型的[input]元素實(shí)現(xiàn)顏色選擇器
實(shí)例4-5　分類展示不同形式的選擇日期
實(shí)例4-6　search類型的[input]元素的使用
實(shí)例4-7　[input]元素中autofocus屬性的使用
實(shí)例4-8　[input]元素中pattern屬性的使用
實(shí)例4-9　[input]元素中placeholder屬性的使用
實(shí)例4-10　[input]元素中required屬性的使用
實(shí)例4-11　[datalist]元素的使用
實(shí)例4-12　[output]元素的使用
實(shí)例4-13　[keygen]元素的使用
實(shí)例4-14　調(diào)用表單的checkvalidity方法
實(shí)例4-15　調(diào)用表單的setcustomvalidity方法
實(shí)例4-16　表單中novalidate屬性的使用
實(shí)例5-1　選擇單個(gè)文件上傳
實(shí)例5-2　選擇多個(gè)文件上傳
實(shí)例5-3　獲取上傳文件的類型與大小
實(shí)例5-4　通過類型過濾上傳文件
實(shí)例5-5　通過accept屬性過濾上傳文件的類型
實(shí)例5-6　使用readasdataurl方法預(yù)覽圖片
實(shí)例5-7　使用readastext方法讀取文本文件
實(shí)例5-8　展示文件讀取時(shí)觸發(fā)事件的先后順序
實(shí)例5-9　使用datatransfer對(duì)象拖放上傳圖片文件
實(shí)例6-1　使用多媒體元素播放文件
實(shí)例6-2　設(shè)置[video]元素的大小與樣式
實(shí)例6-3　設(shè)置[video]元素的控制條工具屬性
實(shí)例6-4　設(shè)置[video]元素的poster屬性
實(shí)例6-5　獲取[video]元素networkstate屬性的返回值
實(shí)例6-6　獲取[video]元素error屬性的返回值
實(shí)例6-7　自定義[video]元素控制條工具欄
實(shí)例6-8　使用canplaytype方法檢測(cè)瀏覽器支持媒體類型
實(shí)例6-9　獲取多媒體元素在播放事件中的不同狀態(tài)
實(shí)例6-10　通過timeupdate事件動(dòng)態(tài)顯示媒體文件播放時(shí)間
實(shí)例7-1　使用[canvas]元素繪制正方形
實(shí)例7-2　使用[canvas]元素繪制帶邊框的矩形
實(shí)例7-3　使用[canvas]元素繪制有漸變色的圖形
實(shí)例7-4　使用moveto與lineto方法繪制多條直線
實(shí)例7-5　使用arc方法繪制多個(gè)不同樣式的圓形
實(shí)例7-6　使用[canvas]元素繪制徑向漸變的圓形
實(shí)例7-7　使用[canvas]元素移動(dòng)、縮放、旋轉(zhuǎn)圖形
實(shí)例7-8　使用[canvas]元素設(shè)置多圖形組合顯示的方式
實(shí)例7-9　使用[canvas]元素添加繪制圖形陰影
實(shí)例7-10　使用drawimage方法在畫布中繪制圖像
實(shí)例7-11　使用createpattern方法在畫布中平鋪圖像
實(shí)例7-12　使用clip方法在畫布中切割圖像
實(shí)例7-13　使用getimagedata與putimagedata方法處理圖像像素
實(shí)例7-14　使用filltext與stroketext方法繪制文字
實(shí)例7-15　在畫布中保存、恢復(fù)及輸出圖形
實(shí)例7-16　在畫布中制作簡單的動(dòng)畫
實(shí)例8-1　使用sessionstorage對(duì)象保存與讀取臨時(shí)數(shù)據(jù)
實(shí)例8-2　使用localstorage對(duì)象保存與讀取登錄用戶名與密碼
實(shí)例8-3　清空localstorage對(duì)象保存的全部數(shù)據(jù)
實(shí)例8-4　遍歷localstorage對(duì)象保存的全部數(shù)據(jù)
實(shí)例8-5　使用json對(duì)象存取數(shù)據(jù)
實(shí)例8-6　管理localstorage數(shù)據(jù)
實(shí)例8-7　使用opendatabase打開與創(chuàng)建數(shù)據(jù)庫
實(shí)例8-8　使用transaction方法執(zhí)行事務(wù)
實(shí)例8-9　使用executesql方法插入記錄
實(shí)例8-10　使用executesql方法管理數(shù)據(jù)記錄
實(shí)例9-1　開發(fā)一個(gè)簡單的離線應(yīng)用
實(shí)例9-2　監(jiān)測(cè)updateready事件觸發(fā)
實(shí)例9-3　使用update方法更新本地緩存
實(shí)例9-4　使用swapcache方法更新本地緩存
實(shí)例9-5　檢測(cè)離線應(yīng)用在加載過程中觸發(fā)的事件
實(shí)例9-6　通過online屬性檢測(cè)網(wǎng)絡(luò)的當(dāng)前狀態(tài)
實(shí)例9-7　通過online與offline事件檢測(cè)網(wǎng)絡(luò)的當(dāng)前狀態(tài)
實(shí)例9-8　開發(fā)一個(gè)離線留言數(shù)據(jù)交互應(yīng)用
實(shí)例10-1　使用postmessage方法實(shí)現(xiàn)跨文檔傳輸數(shù)據(jù)
實(shí)例10-2　使用websocket對(duì)象傳送數(shù)據(jù)
實(shí)例10-3　使用websocket傳送json對(duì)象
實(shí)例10-4　使用getcurrentposition方法獲取出錯(cuò)數(shù)據(jù)信息
實(shí)例10-5　使用getcurrentposition方法獲取地理位置信息
實(shí)例10-6　使用google地圖鎖定位置
實(shí)例10-7　使用worker對(duì)象處理線程
實(shí)例10-8　使用線程傳遞json對(duì)象
實(shí)例10-9　使用線程嵌套交互數(shù)據(jù)
實(shí)例11-1　使用javascript代碼實(shí)現(xiàn)元素拖放
實(shí)例11-2　元素在拖放過程中觸發(fā)的事件
實(shí)例11-3　使用setdata與getdata方法存入與讀取拖放數(shù)據(jù)
實(shí)例11-4　使用setdragimage方法設(shè)置拖放圖標(biāo)
實(shí)例11-5　使用effectallowed與dropeffect屬性設(shè)置拖放效果
實(shí)例11-6　使用拖放api將商品拖入購物車
實(shí)例11-7　使用拖放api將圖片拖入回收站