H5本地存儲
在以前,我們想要存儲一些數(shù)據(jù),并且只是在前端使用岁钓,服務(wù)端并不會使用,我們只能存在cookie里微王,但是cookie會跟隨請求頭在客戶端和服務(wù)端之間來回傳遞屡限,而且cookie還有一些缺點(diǎn),H5提供了webStorage的API用來做客戶端的數(shù)據(jù)存儲
cookie與webStorage的區(qū)別
- cookie有大小的限制炕倘,只能存儲4kb钧大,webStorage可以存儲5Mb,cookie還有條數(shù)的限制
- cookie會跟隨請求頭在客戶端和服務(wù)端之間傳遞罩旋,會影響帶寬啊央。
- cookie需要設(shè)置有效期眶诈,localStorage是永久保存,sessionStorage是會話保存瓜饥,
- cookie可以設(shè)置作用path
- cookie的操作較為困難逝撬,webStorage的API較為容易
- cookie的兼容性比webStorage兼容性好
webStorage包含的存儲方式
- localStorage :有效期是永遠(yuǎn),永久保存乓土;除非手動刪除
- sessionStorage: 有效期是一次會話時(shí)間
- globalStorage宪潮、indexedDB、webSQL因?yàn)榧嫒菪哉饰摇?shí)用性較差坎炼,所以,不使用
localStorage和sessionStorage 的使用方法(API)
localStorage和sessionStorage的使用方法一樣
-
增刪改查
增/改: localStorage.setItem(key,value)/ localStorage.a = 1
查: length拦键;key方法(index)得到對應(yīng)的key getItem(key)/localStorage.a
刪: removeItem(key)
清空: clear()