1. 程式人生 > >localStorage基於瀏覽器的本地存儲

localStorage基於瀏覽器的本地存儲

color row 通過 關閉 remove isa 相同 stringify 永遠

一 :localStorage和sessionStorage

(1)localStorage和sessionStorage一樣都是用來存儲客戶端臨時信息的對象。
(2)他們均只能存儲字符串類型的對象(雖然規範中可以存儲其他原生類型的對象,但是目前為止沒有瀏覽器對其進行實現)。
(3)localStorage生命周期是永久,這意味著除非用戶顯示在瀏覽器提供的UI上清除localStorage信息,否則這些信息將永遠存在。
(4)sessionStorage生命周期為當前窗口或標簽頁,一旦窗口或標簽頁被永久關閉了,那麽所有通過sessionStorage存儲的數據也就被清空了。
(5)不同瀏覽器無法共享localStorage或sessionStorage中的信息。相同瀏覽器的不同頁面間可以共享相同的localStorage(頁面屬於相同域名和端口),但是不同頁面或標簽頁間無法共享sessionStorage的信息。這裏需要註意的是,頁面及標簽頁僅指頂級窗口,如果一個標簽頁包含多個iframe標簽且他們屬於同源頁面,那麽他們之間是可以共享sessionStorage的。

二:localStorage的方法

(1)監測瀏覽器是否支持localStorage

if(window.localStorage){
     alert(‘This browser supports localStorage‘);
}else{
     alert(‘This browser does NOT support localStorage‘);
}

(2)存儲
localStorage.a = 3;//設置a為”3”
localStorage[“a”] = “sfsf”;//設置a為”sfsf”,覆蓋上面的值
localStorage.setItem(“b”,”isaac”);//設置b為”isaac”

(3)取值
var a1 = localStorage[“a”];//獲取a的值
var a2 = localStorage.a;//獲取a的值
var b = localStorage.getItem(“b”);//獲取b的值

(4)清除單個存儲
localStorage.removeItem(“c”);//清除c的值

(5)清除所有
localStorage.clear();

三:存儲數組或者對象

localStorage只能存儲字符串的數據,對於JS中常用的數組或對象卻不能直接存儲。

可以通過JSON對象提供的parse和stringify將其他數據類型轉化成字符串,再存儲到storage中就可以了

var
obj = { name:‘Jim‘ }; var str = JSON.stringify(obj); //存入 sessionStorage.obj = str; //讀取 str = sessionStorage.obj; //重新轉換為對象 obj = JSON.parse(str);

localStorage基於瀏覽器的本地存儲