AppCan開發平臺之localStorage和sessionStorage的使用

首先天然是檢測瀏覽器是否支持本地存儲。在HTML5中，本地存儲是一個window的屬性，包括localStorage和sessionStorage，從名字應該能夠很清楚的辨認兩者的區別，前者是一直存在本地的，後者只是伴隨着session，窗口一旦關閉就沒了。兩者用法徹底相同，這裏以localStorage爲例。

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

 

存儲數據的方法就是直接給window.localStorage添加一個屬性，例如：window.localStorage.a 或者 window.localStorage["a"]。它的讀取、寫、刪除操做方法很簡單，是以鍵值對的方式存在的，以下：

localStorage.a = 3;//設置a爲"3"
localStorage["a"] = "sfsf";//設置a爲"sfsf"，覆蓋上面的值
localStorage.setItem("b","isaac");//設置b爲"isaac"
var a1 = localStorage["a"];//獲取a的值
var a2 = localStorage.a;//獲取a的值
var b = localStorage.getItem("b");//獲取b的值
localStorage.removeItem("c");//清除c的值

 

這裏最推薦使用的天然是getItem()和setItem()，清除鍵值對使用removeItem()。若是但願一次性清除全部的鍵值對，能夠使用clear()。另外，HTML5還提供了一個key()方法，能夠在不知道有哪些鍵值的時候使用，以下：

var storage = window.localStorage;
function showStorage(){
for(var i=0;i<storage.length;i++){
//key(i)得到相應的鍵，再用getItem()方法得到對應的值
document.write(storage.key(i)+ " : " + storage.getItem(storage.key(i)) + "<br>");
}
}