localStorage可以將第一次請求的數(shù)據(jù)直接存儲到本地,這個相當(dāng)于一個5m大小的針對于前端頁面的數(shù)據(jù)庫
基礎(chǔ)語法
setItem() 修改本地存儲的數(shù)據(jù)
getItem() 獲取對應(yīng)的本地存儲
removeItem() 刪除對應(yīng)的本地存儲
由于存儲的數(shù)據(jù)類型限制 只能存儲字符串類型數(shù)據(jù) 對象存進(jìn)去就是object字符串.
需要存儲的話需要序列化為json格式的字符串.
對象轉(zhuǎn)換為json格式字符串 stringify()
var str = JSON.stringify(obj)
console.log(str)
json格式重新為對象方法 parse()
var obj = JSON.parse(localstorage.getitem(str))
總結(jié) json格式字符串轉(zhuǎn)對象 對象轉(zhuǎn)json格式字符串 原對象不受影響
通過localStorage實(shí)現(xiàn)存儲復(fù)雜數(shù)據(jù)(數(shù)組/ 對象)
同源策略
只要在同源的網(wǎng)站里 localstorage的數(shù)據(jù)是共享的
除非手動銷毀數(shù)據(jù)
同時 我們還可以使用sessionStorage來達(dá)成本地存儲
增刪改查的語法和localstorage是一樣的
存儲類型也是字符串
不同頁面之間不支持?jǐn)?shù)據(jù)共享
瀏覽器關(guān)閉時數(shù)據(jù)就會清空 是臨時存儲
localStorage
1把數(shù)據(jù)存儲到本地 localStorage.setItem("name", "value");
2/獲取數(shù)據(jù) localStorage.getItem("name")
3 刪除指定數(shù)據(jù) localStorage.removeItem("name");
4刪除所有數(shù)據(jù) localStorage.clear();
sessionStorage
1 把數(shù)據(jù)存儲到本地 sessionStorage.setItem("name", "value");
2 獲取數(shù)據(jù) sessionStorage.getItem("name")
3刪除指定數(shù)據(jù) sessionStorage.removeItem("name");
4刪除所有數(shù)據(jù) sessionStorage.clear();
