Web Storage教程
1髓堪、概述：
對于Web Storage來說宾符，實際上是Cookies存儲的進化版踢星。如果了解Cookie的人幾乎一看Web Storage就會用统刮，如果你從來沒用過沒了解過Cookie故源，沒關(guān)系污抬，看了這篇文章照樣輕松玩轉(zhuǎn)Web Storage。首先绳军，學(xué)習(xí)Web Storage只需背熟這句口訣：“兩個接口印机，四個函數(shù)”。
2门驾、口訣：
（1）兩個接口：分別是localStorage和sessonStorage
（2）四個函數(shù)：分別是setItem射赛、getItem、removeItem和clear
3奶是、localStorage：
（1）特性：
域內(nèi)安全楣责、永久保存。即客戶端或瀏覽器中來自同一域名的所有頁面都可訪問localStorage數(shù)據(jù)且數(shù)據(jù)除了刪除否則永久保存聂沙，但客戶端或瀏覽器之間的數(shù)據(jù)相互獨立秆麸。
（2）四個函數(shù)：
A. localStorage.setItem 存儲數(shù)據(jù)信息到本地
B. localStorage.getItem 讀取本地存儲的信息
C. localStorage.removeItem 刪除本地存儲的信息
D. localStorage.clear 清空所以存儲的信息
4、sessonStorage：
（1）特性：
會話控制逐纬、短期保存蛔屹。會話概念與服務(wù)器端的session概念相似，短期保存指窗口或瀏覽器或客戶端關(guān)閉后自動消除數(shù)據(jù)豁生。
（2）四個函數(shù)：
A. sessionStorage.setItem 存儲數(shù)據(jù)信息到本地
B. sessionStorage.getItem 讀取本地存儲的信息
C. sessionStorage.removeItem 刪除本地存儲的信息
D. sessionStorage.clear 清空所以存儲的信息
5兔毒、四個函數(shù)的用法：
（1）localStorage.setItem(鍵名漫贞，鍵值)
在本地客戶端存儲一個字符串類型的數(shù)據(jù)，其中育叁，第一個參數(shù)“鍵名”代表了該數(shù)據(jù)的標(biāo)識符迅脐，而第二個參數(shù)“鍵值”為該數(shù)據(jù)本身。如：
localStorage.setItem("coffeeType", "mocha"); //存儲鍵名為coffeeType和鍵值為mocha的數(shù)據(jù)到本地
localStorage.setItem("coffeePrice", "28"); //有了上一句做參考豪嗽，這句意思你該理解了吧
（2）localStorage.getItem(鍵名)
讀取已存儲在本地的數(shù)據(jù)谴蔑，通過鍵名作為參數(shù)讀取出對應(yīng)鍵名的數(shù)據(jù)。如：
var data = localStorage.getItem("coffeeType"); //讀取對應(yīng)鍵名為coffeeType的數(shù)據(jù)
（3）localStorage.removeItem(鍵名)
移除已存儲在本地的數(shù)據(jù)龟梦，通過鍵名作為參數(shù)刪除對應(yīng)鍵名的數(shù)據(jù)隐锭。如：
localStorage.removeItem("coffeeType"); //從本地存儲中移除鍵名為coffeeType的數(shù)據(jù)
（4）localStorage.clear()
移除本地存儲所有數(shù)據(jù)。如：
localStorage.clear(); //保存著的"coffeePrice/28"鍵/值對也被移除了计贰，所有本地數(shù)據(jù)拜拜
（5）另外钦睡，sessionStorage中的四個函數(shù)與以上localStorage類的函數(shù)用法基本一致，就不再詳解躁倒。
6荞怒、兼容問題：
有人會說本地存儲是H5的新貴，但是對于老秧秉、舊的瀏覽器來說怎么辦褐桌？那就不用老古董瀏覽器唄，或者使用cookie作為替代象迎。因為大多使用localStorage是用來存儲字符串的荧嵌，在其他編譯型的語言看來，存儲字符串能做些什么挖帘，但在javascript身上完丽，舊大放光彩恋技，可以存儲JSON格式的字符串來擴展應(yīng)用拇舀，可以存儲類名變量值等等信息再通過eval()來感受使用JS的快感。既然localStorage是存儲字符串的蜻底，那么在老古董瀏覽器上骄崩，可以通過使用Cookies來做替代方案并做好域內(nèi)安全。
