技術標籤：html5

Web 儲存
隨著網際網路的快速發展，基於網頁的應用越來越普遍，同時也變的越來越複雜，為了滿足各種各樣的需求，會經常性在本地儲存大量的資料，傳統方式我們以document.cookie來進行儲存的，但是由於其儲存大小隻有4k左右，並且解析也相當的複雜，給開發帶來諸多不便，HTML5規範則提出解決方案。Web Storage（sessionStorage和localStorage）

Web 儲存的特性
（1）設定、讀取方便。
（2）容量較大，sessionStorage 約5M、localStorage 約20M。
（3）只能儲存字串，可以將物件 JSON.stringify
 
() 編碼後儲存。

H5 中有兩種儲存方式：
1、window.sessionStorage 會話儲存：

儲存在記憶體中。
生命週期為關閉瀏覽器視窗。也就是說，當視窗關閉時資料銷燬。
在同一個視窗下資料可以共享。

2、window.localStorage 本地儲存：

有可能儲存在瀏覽器記憶體裡，有可能在硬盤裡。
永久生效，除非手動刪除（比如清理垃圾的時候）。
可以多視窗共享。

區別：
sessionStorage將資料儲存在session中，瀏覽器關閉也就沒了；而localStorage則一直將資料儲存在客戶端本地，除非主動刪除資料，否則資料是永遠不會過期的；

不管是sessionStorage，還是localStorage，可使用的API都相同，常用的有如下幾個方法：

儲存資料：localStorage.setItem( key, value );
		 sessionStorage.setItem( key, value );
讀取資料：localStorage.getItem( key ); 
		sessionStorage.getItem( key );
刪除單個數據：localStorage.removeItem( key ); 
			sessionStorage.removeItem( key );
清除所有資料：localStorage.clear( );
			sessionStorage.clear( );

得到某個索引的key：localStorage.key( index ); sessionStorage.key( index );兩個都有屬性 length 表示key 的個數，也即 key 長度：

var keyLength1 = localStorage.length;
 var keyLength2 = sessionStorage.length;

如上，key 和 value 都必須為字串，換言之，web Storage的API只能操作字串。
web storage的瀏覽器支援情況的判斷：
在使用web storage時首先判斷是否支援該功能，有些版本瀏覽器不支援（如IE7及之前的版本不支援），只有支援才可以使用，判斷方法如下：

常見 API
設定儲存內容：

setItem(key, value);

PS：可以新增一個 item，也可以更新一個 item。
讀取儲存內容：

getItem(key);

根據鍵，刪除儲存內容：

removeItem(key);

清空所有儲存內容：

clear();

根據索引值來獲取儲存內容：

key(n);