localStoragelocalStorage能夠將第一次請求的數據直接存儲到本地,解決了cookie存儲空間不足的問題(cookie中每條cookie的存儲空間爲4k),localStorage中通常瀏覽器支持的是5M大小(不一樣的瀏覽器有所不一樣)。json
localStorage的侷限瀏覽器
一、瀏覽器的大小不統一,而且在IE8以上的IE版本才支持localStorage這個屬性cookie
二、目前全部的瀏覽器中都會把localStorage的值類型限定爲string類型,這個在對咱們平常比較常見的JSON對象類型須要一些轉換session
三、localStorage在瀏覽器的隱私模式下面是不可讀取的localstorage
四、localStorage本質上是對字符串的讀取,若是存儲內容多的話會消耗內存空間,會致使頁面變卡code
五、localStorage不能被爬蟲抓取到對象
localStorage與sessionStorage的惟一一點區別就是localStorage屬於永久性存儲,而sessionStorage屬於當會話結束的時候,sessionStorage中的鍵值對會被清空生命週期
localStorage生命週期是永久
sessionStorage生命週期爲當前窗口或標籤頁,一旦窗口或標籤頁被永久關閉了,那麼全部經過sessionStorage存儲的數據也就被清空了內存
//判斷瀏覽器是否支持 if(!window.localStorage){ alert("瀏覽器不支持localstorage"); return false; }else{ //主邏輯業務 var storage=window.localStorage; //寫入a字段 storage["a"]=1; //寫入b字段 storage.b=2; //寫入c字段 storage.setItem("c",3); console.log(typeof storage["a"]); console.log(typeof storage["b"]); console.log(typeof storage["c"]);//打印出來的都是string類型 }
官方推薦的是getItem\setItem這兩種方法對其進行存取rem
var storage=window.localStorage; //增 storage["a"]=1; storage.b=2; storage.setItem("c",3); //刪 storage.clear();//刪除全部內容 storage.removeItem("a");//刪除某個鍵值對 //改 storage.a=4; //查 for(var i=0;i<storage.length;i++){ var key=storage.key(i); console.log(key); }
JSON存入localStorage中,可是在localStorage會自動將localStorage轉換成爲字符串形式,可使用JSON.stringify()這個方法,來將JSON轉換成爲JSON字符串
var data={ name:'xiecanyong', sex:'man', hobby:'program' }; //將JSON對象轉換成爲字符串 var d=JSON.stringify(data); storage.setItem("data",d); //將字符串轉換成爲JSON對象 var json=storage.getItem("data"); var jsonObj=JSON.parse(json);