HTML5 LocalStorage 本地存储

这几天在看mobile map的框架,在地图初始化之前看到了这样一段代码

if (window.localStorage) {

      var BYMapWebSiteTemp = window.localStorage.getItem("BYMapWebSiteTemp");

if (BYMapWebSiteTemp) {

} else {

      BYMapWebSiteTemp = 0;

window.localStorage.setItem("WebSiteInitTime", new Date())

}

if (navigator.onLine) { 

       BYMapWebSiteTemp++;

}

window.localStorage.setItem("BYMapWebSiteTemp", BYMapWebSiteTemp);

     loaderuri += "?t=" + BYMapWebSiteTemp;

} else {

 

}

 

上网查了一下,window.localStorage 本地存储是html5的新功能，本地存储时一个window对象的一个属性,包括localStorage和sessionStorage,后者是用来读取session 信息的，伴随窗口的关闭而消失，以后如果要用到js来获取服务器端session的信息，可以使用这项技术,自己目前还没测试。由于在研究mobile map框架，看了一下本地存储的内容，截图如下

 

可以看到是以key value的形式来存储数据的,具体用法直接粘贴了

 

存储数据的方法就是直接给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>");
 }
}