localStorage:HTML5新增的在瀏覽器端存儲數據的方法。設置和獲取localStorage的方法:
設置: localStorage.name = 'zjj';
獲取: localStorage.name //zjj
sessionStorage: HTML5新增的在瀏覽器端存儲數據的方法,設置和獲取sessionStorage的方法:
設置: sessionStorage.name = 'zjj';
獲取: sessionStorage.name //zjj
cookie:瀏覽器和服務器端都可以設置cookie,傳統的用來存儲數據的方法。
設置和獲取方法見:http://www.cnblogs.com/zmj-blog/p/7119413.html
三者的關系和使用場景:
關系:
1.cookie在瀏覽器和服務器端來回傳遞數據,而localStorage和sessionStorage不會自動把數據發送給服務器,僅會保存在本地。cookie會在瀏覽器請求頭或者ajax請求頭中發送cookie內容。
2.cookie可以設置過期日期,sessionStorage是會話級的數據,瀏覽器窗口關閉即清楚,localStorage是永久性的數據,一旦賦值,不管多長時間這值都是存在的,除非手動清除。
3.cookie的存儲大小受限制,一般不超過4k,而localStorage和sessionStorage的存儲大小一般不超過5M,大大提高了存儲的體積。
4.sessionStorage不跨窗口,在另外一個窗口打開sessionStorage就不存在了,它只在當前窗口有效,而cookie和localStorage都是跨窗口的,即使瀏覽器的窗口關閉,這兩個值還是存在的。
使用場景:
localStorage可以用來統計頁面訪問次數。
sessionStorage可以用來統計當前頁面元素的點擊次數。
cookie一般存儲用戶名密碼相關信息,一般使用escape轉義編碼后存儲。