一、HTML5新特性
1、HTML新元素（標簽語義化意義）例如
注意：標簽語義化的好處？
1）即使沒有CSS的情況下，也能看出代碼的結構
2）有利於其他的設備更好的解析
3）有利於SEO（Search Engine Optimization利用搜索引擎規則提高排名），利於爬蟲抓取有用的信息
4）便於開發人員后期維護
2、input類型，新增多個input輸入類型，便於更好的輸入和驗證
- email：用於應該包含email地址的輸入域
- url：用於應該包含URL地址的輸入域
- number：用於應該包含數值的輸入域。
- range：用於應該包含一定范圍內數字值的輸入域。
- Date pickers (date, month, week, time, datetime, datetime-local)：日期選擇器， 擁有多個可供選取日期和時間的新輸入類型
- search：用於搜索域，比如站點搜索或 Google 搜索。
- color
3、表單元素
4、表單（form input）新屬性
<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
5、canvas
HTML5 <canvas> 元素用於圖形的繪制，通過腳本 (通常是JavaScript)來完成.
例如：<canvas id="myCanvas" width="200" height="100"></canvas>
6、音頻（audio）視頻（video）
audio用法和video類型，除了width height poster屬性不能使用
7、地理位置API
8、拖放
原生JS拖放：
9、web Workers
*進程：操作系統資源分配的基本單位，系統在運行時會給每個進程分配不同的內存空間
*線程：任務調度和執行的基本單位，是線程中的一個獨立單元
*線程池：存放線程的容器，使線程可以反復調用
*多線程：一個進程中運行多個線程，多個線程之間不能共享數據（多個進程之間可以共享數據）
優點：提供CPU的利用率
缺點：創建線程開銷；線程切換開銷；多線程造成死鎖和狀態同步問題
*一個應用程序至少運行在一個進程的一個線程上（即為主線程，啟動線程時自動創建啟動線程時自動創建）
web Workers:由於JavaScript腳本語言的性質決定了它的單線程，但是我們可以利用H5中的web workers將一些復雜的計算放到worker中而不凍結頁面從而達到多線程的效果，但是子線程完全由主線程控制，並且不能操作DOM，所以並沒有改變JavaScript的單線程本質
web Workers的一些問題：不是所有的瀏覽器都兼容；workers中不能訪問DOM；不能跨域加載JS
如何使用web Workers：
10、web storage
http協議
http協議是無狀態的，每次請求都是獨立的。前一次的請求結果與后一次的請求結果無關，對瀏覽器來說都是全新的。
狀態可以理解為服務器與客戶端建立會話時產生的數據，無狀態就是這些數據不會被保留。完成一套完整的操作要發送的請求很多，那么如何將上下文請求進行關聯呢？這就出現了cookie和session。
cookie與session創建過程：
-瀏覽器發送request請求給服務器，服務器會分配一個ID標識協同response一同返回。同時在服務器本地創建一個map結構（這就是session），以鍵值對的形式（key:id,value:會話內容）將每個request存儲
-此時的瀏覽器已經被賦予了一個ID，當瀏覽器再次發送請求時，服務器會先從request中查找這個ID，根據ID查找到會話內容，會話內容中記錄了上一次request的信息狀態
-根據查找到的request內容生成基於這些request的response，發送給瀏覽器。如果有需要會進行會話內容的更新，為下一次request做准備。
總結：
cookie：
是存儲在瀏覽器目錄中的文本文件，瀏覽器運行時，存儲在RAM中發揮作用（Session Cookies）。一旦用戶從該網站或者服務器退出時，cookie存儲在硬盤上（Persistent Cookies）
缺點：
*會被附加在每次的http請求上，所以增加了流量
*cookie存儲在客戶端，極有可能會被攔截，存在安全問題
*雖然一定程度上實現了保持狀態，但是最大支持4069字節
*每個域名下最多生成了cookie個數有限制
session：
支持更多的字節，並且存儲在服務器
缺點：
*保存的東西越多，越占用服務器的資源
*依賴cookie，如果cookie禁用，需要URL重寫，不安全
*創建session有很大的隨意性，不需要開發者做精確的處理，過度使用session會導致代碼可讀性變低，不利於維護
cookie的使用：
1）服務器發送cookie給客戶端（即set-cookie），包括對應的名稱，值
2）在腳本JavaScript中設置修改cookie
sessionStorage:
將數據保存在session對象(保存瀏覽器打開頁面到關閉頁面之間的數據)中，瀏覽器頁面關閉后數據消失、
localStorage：
沒有時間限制的存儲，將用戶的數據保存在客戶端本地的硬件設備上，即使網頁關閉后，在用戶下次訪問該網頁時數據仍然可以使用
區別：
1）cookie的數據在每次http請求時都會攜帶（即使不需要），而webStorage不會，僅在本地保存。數據不是由每個服務器請求傳遞的，而是只有在請求時使用數據。它使在不影響網站性能的情況下存儲大量數據成為可能。cookie還有path的概念，可以將數據限制在某個路徑下
2）因為每次請求都會攜帶cookie所以cookie不會過大(<4K),
3）作用域：cookie和localStorage在同源頁面共享數據，而sessionStorage只在同一個瀏覽器中共享,同一個頁面也不行
4）使用：cookie需要自己封裝getCookie/getCookie而webStorage可以使用原生API
創建並訪問localStorage:
創建並訪問sessionStorage:
11、應用程序緩存
12、SSE(server send event),服務器發送事件，允許網頁獲得來自服務器的更新。
13、web scoket:是 HTML5 開始提供的一種在單個 TCP 連接上進行全雙工通訊的協議，允許服務端主動向客戶端推送消息
為了是實現服務器向客戶端推送消息，以前常使用的是ajax輪詢，該方式有一定的缺點：
-瀏覽器通常需要不斷向服務器發送請求，而http請求的頭部一般很長，而真正有用的部分很小，浪費帶寬。
所以出現了H5的web scoket既能節約帶寬也能實時的進行通訊。
