Html5 web 本地存储 （localStorage、sessionStorage）

HTML5 提供了两种在客户端存储数据的新方法localStorage,sessionStorage

1. sessionStorage（临时存储） ：为每个数据源维持一个存储区域，在浏览器打开期间存在，包括页面从新加载

2. localStorage（长期存储） ：与 sessionStorage 同样，可是浏览器关闭后，数据依然会一直存在

web storage的浏览器支持状况

浏览器的支持除了IE７及如下不支持外，其余标准浏览器都彻底支持(ie及FF需在web服务器里运行)，值得一提的是IE老是办好事，例如IE七、IE6中的UserData其实就是javascript本地存储的解决方案。经过简单的代码封装能够统一到全部的浏览器都支持web storage。要判断浏览器是否支持localStorage能够使用下面的代码：

if(window.localStorage){
alert("浏览支持localStorage") 
}
else
{ 
alert("浏览暂不支持localStorage") 
} 
//或者 if(typeof window.localStorage == 'undefined'){ alert("浏览暂不支持localStorage") }

API

1，保存数据到本地

sessionStorage.setItem('key', value)   //name 是本地存储的值的名字， value是本地存储值，注意value必须是字符串的形式

localStorage.setItem('key', value)   //setItem把值存到本地，其中name 是本地存储的值的名字， value是本地存储值，注意value必须是字符串的形式

2，从本地获取数据

var data1 = JSON.parse(sessionStorage.getItem('key'));

var data2 = JSON.parse(localStorage.getItem('key'));

3，从本地删除某个数据

sessionStorage.removeItem('key');

localStorage.removeItem('key');

4，删除全部保存在本地的数据

sessionStorage.clear();

localStorage.clear();

chrome浏览器查看的方法

按F12,而后选择application就能够看到了

 

Cookie、session和localStorage、以及sessionStorage之间的区别:https://blog.csdn.net/ruby_xc/article/details/65939988