HTML5
HTML5 Web 存储
- 在HTML5之前,主要是使用cookies存储,cookies的缺点有:需要在请求头上带着数据,存储大小不过,在4k之内。本节, - HTML5 web 存储,一个比cookie更好的本地存储方式。 #### localStorage 对象 localStorage 对象存储的数据没有时间限制。第二天、第二周或下一年之后,数据依然可用。 ```html if(typeof(Storage)!=="undefined") { // 是的! 支持 localStorage sessionStorage 对象! if (localStorage.clickcount){ localStorage.clickcount=Number(localStorage.clickcount)+1; }else{ localStorage.clickcount=1; } document.getElementById("result").innerHTML=" 你已经点击了按钮 " + localStorage.clickcount + " 次 "; } else { // 抱歉! 不支持 web 存储。 } ``` #### sessionStorage 对象 sessionStorage 方法针对一个 session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除。 ```html if(typeof(Storage)!=="undefined") { // 是的! 支持 localStorage sessionStorage 对象! if (sessionStorage.clickcount) { sessionStorage.clickcount=Number(sessionStorage.clickcount)+1; } else { sessionStorage.clickcount=1; } document.getElementById("result").innerHTML="在这个会话中你已经点击了该按钮 " + sessionStorage.clickcount + " 次 "; } else { // 抱歉! 不支持 web 存储。 } ``` #### Web API - 保存数据:localStorage.setItem(key,value); - 读取数据:localStorage.getItem(key); - 删除单个数据:localStorage.removeItem(key); - 删除所有数据:localStorage.clear(); - 得到某个索引的key:localStorage.key(index);
顶部
收展
底部
[TOC]
目录
HTML5 Web 存储
HTML5 Web Workers
HTML5 WebSocket
HTML5 SSE
HTML5 语义元素
HTML5 表单元素属性
HTML5 地理定位
HTML5 拖放(Drag 和 Drop)
相关推荐
HTML5音视频
HTML5画布