1: if(window.localStorage){ 2: alert('This browser supports localStorage'); 3: }else{ 4: alert('This browser does NOT support localStorage'); 5: }
存储数据的方法就是直接给window.localStorage添加一个属性,例如:window.localStorage.a 或者 window.localStorage["a"]。它的读取、写、删除操作方法很简单,是以键值对的方式存在的,如下:
1: localStorage.a = 3;//设置a为"3" 2: localStorage["a"] = "sfsf";//设置a为"sfsf",覆盖上面的值 3: localStorage.setItem("b","isaac");//设置b为"isaac" 4: var a1 = localStorage["a"];//获取a的值 5: var a2 = localStorage.a;//获取a的值 6: var b = localStorage.getItem("b");//获取b的值 7: localStorage.removeItem("c");
//清除c的值
获取设置键值推荐使用getItem()和setItem(),清除键值对使用removeItem()。 使用clear() 清除所有的键值对。
HTML5本地存储只能储存字符串数据,任何格式存储的时候都会被自动转为字符串,所以读取的时候,需要自己进行类型的转换。
HTML5的本地存储提供了一个storage事件,可以监听对键值对的改变,使用方法如下:
1: if(window.addEventListener){ 2: window.addEventListener("storage",handle_storage,false); 3: }else if(window.attachEvent){ 4: window.attachEvent("onstorage",handle_storage); 5: } 6: function handle_storage(e){ 7: if(!e){e=window.event;} 8: //showStorage(); 9: }
事件变量e,是一个StorageEvent对象,提供了一些实用的属性,可以很好的观察键值对的变化。
§ key String 监听到改变的键名称
§ oldValue 任意 改变前的值
§ newValue 任意 改变后的值
§ url String 监听到键值改变对应的页面地址
目前javascript使用最多的数据格式是json,如果想用HTML5的本地存储来存储Json数据,直接调用JSON.stringify()将json数据转为字符串。读取出来后再调用JSON.parse()将字符串转为json格式,代码如下所示:
var details = {author:"isaac","description":"fresheggs","rating":100}; storage.setItem("details",JSON.stringify(details)); details = JSON.parse(storage.getItem("details"));
以上就是浅谈HTML5的本地存储特性的内容,更多相关内容请关注PHP中文网(HdhCmsTestgxlcms测试数据)!