标签:
localStorage
html5标准 Web 存储
现在的主流浏览器,包括IE 8+、Chrome 4+、Firefox 3.5+、Opera 10.5+、Safari 4+、iPhone 2+、Android 2+等,都支持localStorage本地存储功能。
localStorage没有时间上的限制,只要不主动删除,会一直保存。
单条value没有长度限制,但是每个站点使用总量有限制。
chrome的上限是4.9MB,其它浏览器的容量上限也大都在2.5-10MB之间。
检测浏览器是否支持localStorage
function check_localStorage_support() { if(window.localStorage){ return true; } alert("Sorry,your browser does NOT support localStorage!"); return false; }
localStorage 基于键值对存储,读、写、删操作很简单
localStorage.a = 3; //设置a为"3" localStorage["a"] = "abc"; //设置a为"abc",也覆盖了上面的值 var a1 = localStorage["a"]; //获取a的值 var a2 = localStorage.a; //获取a的值 console.log(a1 + "\t" + a2); localStorage.setItem("b","I am b"); //设置b为"I am b" var b = localStorage.getItem("b"); //获取b的值 console.log(b); localStorage.removeItem("b"); //清除b的值 console.log(localStorage.getItem("b")); //输出所有键值对 function showStorage(){ var storage = window.localStorage; for(var i=0;i<storage.length;i++){ //key(i)获得相应的键,再用getItem()方法获得对应的值 document.write(storage.key(i)+ " : " + storage.getItem(storage.key(i)) + "<br>"); } } //清除所有键值对 localStorage.clear();
添加监听事件
if(window.addEventListener){ window.addEventListener("storage",handle_storage,false); }else if(window.attachEvent){ window.attachEvent("onstorage",handle_storage); } function handle_storage(e){ if(!e){e=window.event;} //showStorage(); }
属性 | 类型 | 说明 |
key | string | 增加、删除或者修改的那个键 |
oldValue | any | 改写之前的旧值,如果是新增的元素,则是 null |
newValue | any | 改写之后的新值,如果是删除的元素,则是 null |
url | string | 触发这个改变事件的页面 URL |
从localStorage读取一个对象
var chapter = JSON.parse(localStorage.getItem(chapterid));
使用Jquery Ajax 获取一个json并存入localStorage
$.getJSON("/worker/json/"+Chapterid+".json",function(result){ localStorage.setItem(chapterid,JSON.stringify(result)); });
php生成json的代码
class chapter_data { public $serialid = 0; public $serialtitle = ""; public $serialcontent = ""; } $chapter = new chapter_data(); $chapter->serialid = 1; $chapter->serialtitle = "文章标题"; $chapter->serialcontent = "文章内容"; echo json_encode($chapter);
标签:
原文地址:http://www.cnblogs.com/edit/p/5780441.html