HTML5
1.HTML5?新元素
HTML5提供了新的元素來創(chuàng)建更好的頁面結(jié)構(gòu)：
標(biāo)簽描述
2.HTML5 Canvas
HTML5? <canvas>? 元素用于圖形的繪制，通過腳本?(通常是JavaScript)來完成.
?<canvas>? 標(biāo)簽只是圖形容器，您必須使用腳本來繪制圖形。
使用 JavaScript 來繪制圖像
canvas 元素本身是沒有繪圖能力的。所有的繪制工作必須在 JavaScript 內(nèi)部完成：
3.HTML5?拖放
?拖放是一種常見的特性，即抓取對(duì)象以后拖到另一個(gè)位置。在 HTML5 中，拖放是標(biāo)準(zhǔn)的一部分，任何元素都能夠拖放。
設(shè)置元素為可拖放
4.HTML5?地理定位
?HTML5 Geolocation API 用于獲得用戶的地理位置。
鑒于該特性可能侵犯用戶的隱私，除非用戶同意，否則用戶位置信息是不可用的。
5.HTML5??Audio(音頻)、Video(視頻)
?HTML5 規(guī)定了在網(wǎng)頁上嵌入音頻元素的標(biāo)準(zhǔn)，即使用 <audio>元素。
HTML5 規(guī)定了一種通過 video 元素來包含視頻的標(biāo)準(zhǔn)方法。
6.HTML5 Input?類型
?HTML5 擁有多個(gè)新的表單輸入類型。這些新特性提供了更好的輸入控制和驗(yàn)證。
color、date、datetime、datetime-local、email、month、number、range、search、tel、time、url、week
7.HTML5?表單元素
?HTML5 有以下新的表單元素:
<datalist>? 元素規(guī)定輸入域的選項(xiàng)列表。
<datalist> 屬性規(guī)定 form 或 input 域應(yīng)該擁有自動(dòng)完成功能。當(dāng)用戶在自動(dòng)完成域中開始輸入時(shí)，瀏覽器應(yīng)該在該域中顯示填寫的選項(xiàng)：
使用 元素的列表屬性與 元素綁定.
8.HTML5?表單屬性
?HTML5 的 <form>? 和? <input> 標(biāo)簽添加了幾個(gè)新屬性.
<form> 新屬性：
autocomplete、novalidate
<input> 新屬性：
autocomplete、autofocus、form、formaction、formenctype、formmethod、formnovalidate、formtarget、height and width、list、min and max、multiple、pattern (regexp)、placeholder、required、step
?
9.HTML5?語義元素
?HTML5提供了新的語義元素來明確一個(gè)Web頁面的不同部分:
10.HTML5 Web?存儲(chǔ)
?Web Storage DOM API 為Web應(yīng)用提供了一個(gè)能夠替代cookie的Javascript解決方案
sessionStorage—客戶端數(shù)據(jù)存儲(chǔ)，只能維持在當(dāng)前會(huì)話范圍內(nèi)。
? ? ? ? ? ? ?sessionStorage 方法針對(duì)一個(gè) session 進(jìn)行數(shù)據(jù)存儲(chǔ)。當(dāng)用戶關(guān)閉瀏覽器窗口后，數(shù)據(jù)會(huì)被刪除。
localStorage—客戶端數(shù)據(jù)存儲(chǔ)，能維持在多個(gè)會(huì)話范圍內(nèi)。
? ? ? ? ? ? ?localStorage 對(duì)象存儲(chǔ)的數(shù)據(jù)沒有時(shí)間限制。第二天、第二周或下一年之后，數(shù)據(jù)依然可用。
對(duì)于大量復(fù)雜數(shù)據(jù)結(jié)構(gòu)，一般使用IndexDB
?
11.HTML5?離線Web應(yīng)用（應(yīng)用程序緩存）
?HTML5 引入了應(yīng)用程序緩存，這意味著 web 應(yīng)用可進(jìn)行緩存，并可在沒有因特網(wǎng)連接時(shí)進(jìn)行訪問。
應(yīng)用程序緩存為應(yīng)用帶來三個(gè)優(yōu)勢(shì)：
離線瀏覽 - 用戶可在應(yīng)用離線時(shí)使用它們
速度 - 已緩存資源加載得更快
減少服務(wù)器負(fù)載 - 瀏覽器將只從服務(wù)器下載更新過或更改過的資源。
HTML5 Cache Manifest 實(shí)例
下面的例子展示了帶有 cache manifest 的 HTML 文檔（供離線瀏覽）：
Manifest 文件
manifest 文件是簡單的文本文件，它告知瀏覽器被緩存的內(nèi)容（以及不緩存的內(nèi)容）。
manifest 文件可分為三個(gè)部分：
CACHE MANIFEST?- 在此標(biāo)題下列出的文件將在首次下載后進(jìn)行緩存
NETWORK?- 在此標(biāo)題下列出的文件需要與服務(wù)器的連接，且不會(huì)被緩存
FALLBACK?- 在此標(biāo)題下列出的文件規(guī)定當(dāng)頁面無法訪問時(shí)的回退頁面（比如 404 頁面
1-CACHE MANIFEST
2-# 2012-02-21 v1.0.0
3-/theme.css
4-/logo.gif
5-/main.js
6-NETWORK:
7-login.php
8-FALLBACK:
9-/html/ /offline.html
12.HTML5 Web Workers
?當(dāng)在 HTML 頁面中執(zhí)行腳本時(shí)，頁面的狀態(tài)是不可響應(yīng)的，直到腳本已完成。
web worker 是運(yùn)行在后臺(tái)的 JavaScript，獨(dú)立于其他腳本，不會(huì)影響頁面的性能。您可以繼續(xù)做任何愿意做的事情：點(diǎn)擊、選取內(nèi)容等等，而此時(shí) web worker 在后臺(tái)運(yùn)行。（相當(dāng)于實(shí)現(xiàn)多線程并發(fā)）
?
13.HTML5 SSE
?Server-Sent 事件指的是網(wǎng)頁自動(dòng)獲取來自服務(wù)器的更新。
以前也可能做到這一點(diǎn)，前提是網(wǎng)頁不得不詢問是否有可用的更新。通過服務(wù)器發(fā)送事件，更新能夠自動(dòng)到達(dá)。
例子：Facebook/Twitter 更新、估價(jià)更新、新的博文、賽事結(jié)果等。
EventSource 對(duì)象用于接收服務(wù)器發(fā)送事件通知：
14.HTML5 WebSocket
?WebSocket是HTML5開始提供的一種在單個(gè) TCP 連接上進(jìn)行全雙工通訊的協(xié)議。在WebSocket API中，瀏覽器和服務(wù)器只需要做一個(gè)握手的動(dòng)作，然后，瀏覽器和服務(wù)器之間就形成了一條快速通道。兩者之間就直接可以數(shù)據(jù)互相傳送。瀏覽器通過 JavaScript 向服務(wù)器發(fā)出建立 WebSocket 連接的請(qǐng)求，連接建立以后，客戶端和服務(wù)器端就可以通過 TCP 連接直接交換數(shù)據(jù)。當(dāng)你獲取 Web Socket 連接后，你可以通過?send()?方法來向服務(wù)器發(fā)送數(shù)據(jù)，并通過?onmessage?事件來接收服務(wù)器返回的數(shù)據(jù)。以下 API 用于創(chuàng)建 WebSocket 對(duì)象。
