什么是localStorage
在HTML5中，新加入了一個(gè)localStorage特性，這個(gè)特性主要是用來(lái)作為本地存儲(chǔ)來(lái)使用的，
解決了cookie存儲(chǔ)空間不足的問(wèn)題(cookie中每條cookie的存儲(chǔ)空間為4k)，
localStorage中一般瀏覽器支持的是5M大小，這個(gè)在不同的瀏覽器中l(wèi)ocalStorage會(huì)有所不同
localStorage的優(yōu)勢(shì)
1、localStorage拓展了cookie的4K限制
2、localStorage會(huì)可以將第一次請(qǐng)求的數(shù)據(jù)直接存儲(chǔ)到本地，這個(gè)相當(dāng)于一個(gè)5M大小的針對(duì)于前端頁(yè)面的數(shù)據(jù)庫(kù)，相比于cookie可以節(jié)約帶寬，但是這個(gè)卻是只有在高版本的瀏覽器中才支持的
localStorage的局限
1、瀏覽器的大小不統(tǒng)一，并且在IE8以上的IE版本才支持localStorage這個(gè)屬性
2、目前所有的瀏覽器中都會(huì)把localStorage的值類型限定為string類型，這個(gè)在對(duì)我們?nèi)粘１容^常見(jiàn)的JSON對(duì)象類型需要一些轉(zhuǎn)換
localStorage的寫(xiě)入
localStorage的寫(xiě)入有三種方法。 localStorage只支持string類型的存儲(chǔ)
varstorage=window.localStorage;
??????????? //寫(xiě)入a字段
??????????? storage["a"]=1;
??????????? //寫(xiě)入b字段
????????? ??storage.b=1;
??????????? //寫(xiě)入c字段
??? ????????storage.setItem("c",3);
localStorage的讀取
三種對(duì)localStorage的讀取，其中官方推薦的是getItem\setItem這兩種方法對(duì)其進(jìn)行存取
??????????? //第一種方法讀取
??????????? var a=storage.a;
??????????? console.log(a);? // 1
??????????? //第二種方法讀取
?????? window.localStorage.setItem("b",2)
??????????? var b=storage["b"];
??????????? console.log(b); // 2
??????????? //第三種方法讀取
??????????? var c=storage.getItem("c");//加雙引號(hào)?。?/p>
??????????? console.log(c) // 3
localStorage的修改
改這個(gè)步驟比較好理解，思路跟重新更改全局變量的值一樣
varstorage=window.localStorage;
//寫(xiě)入a字段
storage["a"]=1;
storage.a=4; //修改
console.log(storage.a)
localStorage的刪除
將localStorage中的某個(gè)鍵值對(duì)刪除
storage.setItem("c",3);
console.log(storage);
storage.removeItem("a");
將localStorage的所有內(nèi)容清除：
storage.clear();
localStorage其他注意事項(xiàng)
一般我們會(huì)將JSON(js中的對(duì)象)存入localStorage中，但是在localStorage會(huì)自動(dòng)將localStorage轉(zhuǎn)換成為字符串形式
vardata={name:'zhangsan',sex:'man',};
storage.setItem(data)
//[object Object]
這個(gè)時(shí)候我們可以使用JSON.stringify()這個(gè)方法，來(lái)將JSON轉(zhuǎn)換成為JSON字符串
??????????? var data={
??????????????? name:'zhangsan',
??????????????? sex:'man',
??????????? };
??????????? var d=JSON.stringify(data);
???????????storage.setItem("data",d);
??????????? //將JSON字符串轉(zhuǎn)換成為JSON對(duì)象輸出
??????????? varjson=storage.getItem("data");
??????????? var jsonObj=JSON.parse(json);
