存儲類型

• 他們均只能存儲字符串類型的對象（雖然規(guī)范中可以存儲其他原生類型的對象，但是目前為止沒有瀏覽器對其進(jìn)行實現(xiàn)）。

生命周期

• localStorage生命周期是永久，這意味著除非用戶顯示在瀏覽器提供的UI上清除localStorage信息，否則這些信息將永遠(yuǎn)存在。
• sessionStorage生命周期為當(dāng)前窗口或標(biāo)簽頁，一旦窗口或標(biāo)簽頁被永久關(guān)閉了，那么所有通過sessionStorage存儲的數(shù)據(jù)也就被清空了。
• 如果不設(shè)置過期時間，那么cookie存儲在內(nèi)存里，如果通過cookie.setMaxAge(num)設(shè)置了過期時間，那么瀏覽器就會把cookie保存到硬盤上，關(guān)閉后再次打開瀏覽器，這些cookie依然有效直到超過設(shè)定的過期時間。存儲在硬盤上的cookie可以在不同的瀏覽器進(jìn)程間共享，比如兩個IE窗口。而對于保存在內(nèi)存的cookie，不同的瀏覽器有不同的處理方式；
  cookie.setmaxage設(shè)置為0時，會馬上在瀏覽器上刪除指定的cookie，
  cookie.setmaxage設(shè)置為-1時，代表關(guān)閉當(dāng)前瀏覽器即失效。

什么情況下可共享（即可訪問）？

• 不同瀏覽器無法共享localStorage或sessionStorage中的信息。
• 相同瀏覽器的不同頁面間可以共享相同的 localStorage（頁面屬于相同域名和端口），但是不同頁面或標(biāo)簽頁間無法共享sessionStorage的信息。這里需要注意的是，頁面及標(biāo) 簽頁僅指頂級窗口，如果一個標(biāo)簽頁包含多個iframe標(biāo)簽且他們屬于同源頁面，那么他們之間是可以共享sessionStorage的。
• cookie數(shù)據(jù)始終在同源的http請求中攜帶（即使不需要），即cookie在瀏覽器和服務(wù)器間來回傳遞。
  -同源的判斷規(guī)則：

   http://www.test.com

https://www.test.com （不同源，因為協(xié)議不同）

http://my.test.com（不同源，因為主機名不同）

http://www.test.com:8080（不同源，因為端口不同）

使用示例

localStorage及sessionStorage的使用

• localStorage和sessionStorage使用時使用相同的API：

localStorage.setItem("key","value");//以“key”為名稱存儲一個值“value”
localStorage.getItem("key");//獲取名稱為“key”的值

• 枚舉localStorage的方法：

for(var i=0;i<localStorage.length;i++){
     var name = localStorage.key(i);
     var value = localStorage.getItem(name);
}

• 刪除localStorage中存儲信息的方法：

localStorage.removeItem("key");//刪除名稱為“key”的信息。
localStorage.clear();//清空localStorage中所有信息

• 通過getItem或直接使用localStorage["key"]獲取到的信息均為實際存儲的副本。例如：這里是無法對實際存儲的值產(chǎn)生作用的，下面的寫法不可以：

localStorage.getItem("key").value1="a";

cookie的使用

cookie的使用

存儲大小限制

• localstorage 大小限制大概在5MB左右，但每個瀏覽器不一樣；
• sessionstorage大小限制大概在5MB左右；
• cookie數(shù)據(jù)不能超過4KB，同時因為每次http請求都會攜帶cookie，所以cookie只適合保存很小的數(shù)據(jù)，如會話標(biāo)識;

兼容性考慮

cookie

所有瀏覽器及其各版本均兼容cookie；

LocalStorage（SessionStorage同）

以下瀏覽器兼容LocalStorage及LocalStorage：

提供以下存取方法，兼容所有瀏覽器，并兼顧localstorage大容量存儲的優(yōu)勢：

• 存值

var arrStr = "首頁";

//存儲，IE6~7 cookie 其他瀏覽器HTML5本地存儲
if (window.localStorage) {
    localStorage.setItem("menuTitle", arrStr);  
} else {
    Cookie.write("menuTitle", arrStr);  
}

• 取值

var strStoreDate = window.localStorage
? localStorage.getItem("menuTitle"): Cookie.read("menuTitle");  

參考文章

cookie使用要點
cookie的使用