（2）localStorage.getItem(键名) 读取已存储在本地的数据，通过键名作为参数读取出对应键名的数据。如：
| var data = localStorage.getItem("name"); alert(data);//张三 |
（3）localStorage.removeItem(键名)移除已存储在本地的数据，通过键名作为参数删除对应键名的数据。如：
| var data2 = localStorage.removeItem("name");//从本地存储中移除键名为name的数据 alert(data2); //undefined |
（4）localStorage.clear() 移除本地存储所有数据。如：
| localStorage.clear() 移除本地存储所有数据。如： localStorage.clear(); //保存着的"age/28"和"name/张三"的键/值对也被移除了，所有本地数据拜拜 |
（5）另外，sessionStorage中的四个函数与以上localStorage类的函数用法基本一致，就不再详解。
下面是一个小实例：
| <script type="text/javascript"> localStorage.setItem("name", "张三"); localStorage.setItem("age", "28"); verify(); //验证本地存储 localStorage.removeItem("name"); verify(); //验证name是否存在 localStorage.clear(); verify(); //验证name和age是否存在 //自定义验证函数，验证name和age的数据是否存在 function verify(){ var type = localStorage.getItem("name"); var price = localStorage.getItem("age"); type = type ? type : '不存在'; price = price ? price : '不存在'; alert( "name: " + type + "nn" + "age: " + price ); } </script> |
三、localStorage过期策略
由于html5没有给本地存储设置过期策略，那么在处理数据的过期策略的时候可以编写自己过期策略程序，如下：
| <!DOCTYPE> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Access-Control-Allow-Origin" content="anonymous"> <title>locstorage 过期策略</title> </head> <body> </body> </html> <script> function set(key,value){ var curtime = new Date().getTime();//获取当前时间 localStorage.setItem(key,JSON.stringify({val:value,time:curtime}));//转换成json字符串序列 /* 说明： JSON.parse用于从一个字符串中解析出json对象,如 var str = '{"name":"huangxiaojian","age":"23"}' 结果： JSON.parse(str) Object age: "23" name: "huangxiaojian" __proto__: Object 注意：单引号写在{}外，每个属性名都必须用双引号，否则会抛出异常。 JSON.stringify()用于从一个对象解析出字符串，如 var a = {a:1,b:2} 结果： JSON.stringify(a) "{"a":1,"b":2}" */ } function get(key,exp)//exp是设置的过期时间 { var val = localStorage.getItem(key);//获取存储的元素 var dataobj = JSON.parse(val);//解析出json对象 if(new Date().getTime() - dataobj.time > exp)//如果当前时间-减去存储的元素在创建时候设置的时间 > 过期时间 { console.log("expires");//提示过期 } else{ console.log("val="+dataobj.val); } } </script> |
