localstorage基础

localstorage是浏览器为页面准备的本地存储,每个域(域名)大约有5MB的空间,而且大部分浏览器都做了支持,IE支持到IE8。下面是流水账写一些localstorage的基础知识。

1.localstorage和cookie的对比。

存储空间大小:localstorage每个域是5MB,而cookie是4KB。

浏览器支持性:cookie浏览器都有支持,localstorage老式浏览器是不支持的。

与服务器交互:cookie会自动随请求发送到服务器的,而localstorage不会。

过期:localstorage存储的数据除非主动删除,否则是永远不过期的。

2.localstorage api

存入数据:localstorage.setItem('test','balabala');

    localstorage['test'] = 'balabala';

读取数据:var str = localstorage.getItem('test');

     var str = localstorage['test'];

遍历:

for(var i = 0; i < localstorage.length; i ++){
  var key = localstorage.key(i);
  var value = localstorage.getItem(key);      
}
for(var i in localstorage){
  var key = i;
  var value = localstorage[key];        
}

删除:

localstorage.removeItem(key);

localstorage.clear(); //删除这个域的全部localstorage

3.localstorage数据格式

localstorage里面的键值对都是以字符串的形式存储进去的,读取出来如果想使用数值的话不要忘记类型转换。

4.localstorage一般可以在高级浏览器的控制台直接看到和做删除操作。

5.localstorage里面的值是以字符串的形式存进去的,如果你想存数组或者json也是可以的,不过存进去之前用JSON.stringify来做下处理,取出来之前用JSON.parse在解析出来即可。

6.因为localstorage存储空间是有限的,在写入数据的时候有可能写不进去。可以用try catch语句来捕获异常。safari和chrome会抛出QUOTA_EXCEEDED_ERR的异常。

7.sessionStorage与localstorage

sessionStorage的api与localstorage的api完全相同,他俩的区别在于sessionStorage在用户关闭浏览器窗口之后会删除本地存储的数据,而localstorage会长期存储。

 

posted @ 2014-07-21 21:54  前端小蜗牛  阅读(555)  评论(0编辑  收藏  举报