HTML5 web存储

什么是web存储

html5 web存储是一个在本地存储数据的存储方式。它可以在本地存储用户的浏览数据。web 存储又叫 web storage。web storage 分为localStorage和sessionStorage。sessionStorage用于本地存储一个会话中的数据，这些数据只有在同一个会话中的页面才能访问，并且当会话结束后数据也随之销毁。所以，sessionStorage不能长久的存储数据。而localStorage则与之相反。它用于持久化的本地存储，数据永远不会过期，除非主动删除。

现在大部分浏览器一般都支持webstorage，但是为了避免万一，需要首先检验一下用的浏览器是否支持webstorage，代码如下：

if(typeof(Storage)!=="undefined")
{
    alert(" 支持 localStorage  sessionStorage ");
} else {
  alert("不支持 web 存储。");
}

web storage 常用API

保存数据：localStorage.setltem(key,value);

//以“name”为名称存储一个值“Lee”，这三种设置值方式是一样的；
localStorage.name = "Lee"；
localStorage["name"] = "Lee"；
localStorage.setItem("name","Lee");

读取数据：localStorage.geeltem(key);

//获取名称为“name”的值，这三种获取值方式是一样的；
var name = localStorage["name"];
var name = localStorage.name;
var name = localStorage.getItem("name");

删除单个数据：localStorage.removeltem(key);

//清除name的值
localStorage.removeItem("name");
localStorage.name = "";

删除所有数据：localStorage.clear();

 //清除name的值
 localStorage.clear();

得到某个索引的key：localStorage.key(index);

key和value通常以字符串的方式存在。

web storage的作用域

不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的 localStorage（页面属于相同域名和端口），但是不同页面或标签页间无法共享sessionStorage的信息。这里需要注意的是，页面及标签页仅指顶级窗口，如果一个标签页包含多个iframe标签且他们属于同源页面，那么他们之间是可以共享sessionStorage的。