关闭

HTML5 LocalStorage 本地存储

标签: LocalStorage
799人阅读 评论(0) 收藏 举报
分类:

首先自然是检测浏览器是否支持本地存储。在HTML5中,本地存储是一个window的属性,包括localStoragesessionStorage,从名字应该可以很清楚的辨认二者的区别,前者是一直存在本地的,后者只是伴随着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>");
 }

}


需要注意的是,HTML5本地存储只能存字符串,任何格式存储的时候都会被自动转为字符串,所以读取的时候,需要自己进行类型的转换。这也就是上一段代码中parseInt必须要使用的原因。


看下图:



0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:1136971次
    • 积分:12871
    • 等级:
    • 排名:第1056名
    • 原创:300篇
    • 转载:79篇
    • 译文:4篇
    • 评论:586条
    大 师 兄 说
    • 交流群:好像不需要吧
    • 我扣扣:1181415316
    • 我邮箱:cmshome@163.com
    • 我格言:"习惯就好"坑了多少人
    • 暂时在:帝都
    • 曾工作:成都
    • 我爱好:海贼王
    • 我爱好:英雄杀
    • 我家乡:济源市
    • 我爱好:写bug
    • 求求求:有问题就留言吧
    • 为啥呢:大师兄是一直在维护的
      你觉得本博文对你有用吗 有用,那就请点赞留言。 暂时没用,也请不要踩。
    博客专栏
    最新评论