码迷,mamicode.com
首页 > Web开发 > 详细

HTML5本地存储localStorage

时间:2017-12-04 18:58:32      阅读:159      评论:0      收藏:0      [点我收藏+]

标签:window   get   使用   event   需要   length   支持   dev   浏览器   

1.使用localStorage需要先对浏览器进行检测是否支持

if(window.localStorage){

  console.log("浏览器支持localStorage")

}else{

  console.log("浏览器不支持localStorage")

}

2.localStorage写入、读取、删除(使用本地存储就是对window.localStorage添加属性)

if(window.localStorage){

//<1>添加属性

  localStorage.name="金翅鸟";//添加name属性

  localStorage["age"]=20;//添加age属性

  localStorage.setItem("sex","男");//添加sex属性----(推荐使用该方法设置属性)

//<2>读取属性

  var a1=localStorage.name;

  var a2=localStorage["age"];

  var a3=localStorage.getItem();//推荐使用该方法

//<3>删除属性(删除全部属性用clear() )

  localStorage.removeItem();

}

3.localStorage提供的key()方法

if(window.localStorage){

  var storage=window.localStorage;

  function showStorage(){

    for(var i=0; i<storage.length;i++){

      console.log(storage.key(i)+storage.getItem(storage.key(i)))

    }

  }

  showStorage();

}

4.localStorage还提供了storage()事件,可以对键值对改变进行监听

if(window.addEventListener){

  window.addEventListener("storage",handle_storage,false);

}else if(window.attachEvent){

   window.attacheEvent("onstorage",handle_storage)

}

function  handle_storage(){

  if(!e){e=window.event}

}

HTML5本地存储localStorage

标签:window   get   使用   event   需要   length   支持   dev   浏览器   

原文地址:http://www.cnblogs.com/wangpengfei8313/p/7978046.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!