1，Web存储介绍HTML5的Web存储功能是让网页在用户计算机上保存一些信息。Web存储又分为两种： （1）本地存储，对应localStorage对象。用于长期保存网站的数据，并且站内任何页面都可以访问该数据。 （2）会话存储，对应sessionStorage对象。用于临时保存针对一个窗口（或标签页）的数据。在访客关闭窗口或者标签页之前，这些数据是存在的，而关闭之后就会被浏览器删除。
2，本地存储与会话存储的异同 （1）本地存储和会话存储的操作代码完全相同，它们的区别仅在于数据的寿命。 （2）本地存储主要用来保存访客将来还能看到的数据。 （3）会话存储则用于保存那些需要从一个页面传递给下一个页面的数据。
3，Web存储容量限制 大多数浏览器都把本地存储限制为5MB以下。这个是和网站所在的域联系在一起的。
4，Web存储的使用样例 下面以本地存储（localStorage）为例，会话存储改成sessionStorage对象即可。
（1）文本数据的保存和读取
（2）数值的保存和读取
（3）日期的保存和读取
（4）自定义对象的保存和读取
对象的保存和读取可以通过JSON编码转换来实现。
JSON.stringify()：把任何对象连同其数据转换为文本形似。
JSON.parse()：把文本转换回对象。
（5）检测某个键的值是否为空，可以直接测试是否等于null
（6）删除数据项
（7）清除所有数据
（8）查找所有的数据项
不知道键名，可以使用key()方法从本地或者会话存储中取得所有的数据项。下面样例，点击按钮后就会列出所有本地存储中的数据。
5，响应存储变化
Web存储也为我们提供了在不同浏览器窗口间通信的机制。也就是说在本地存储或会话存储发生变化时，其他查看同一页面或者同一站点中其他页面的窗口就会触发window.onStorage事件。
这里说的存储变化，指的是向存储中添加新数据项，修改既有数据项，删除数据项或者清除所有数据。而对存储不产生任何影响的操作（用既有键名保存相同的值，或者清除原本就是空的存储空间），不会引发onStorage事件。
下面同时打开两个页面，在页面1中修改数据项，页面2会响应onStorage事件，并报告结果。
--- page1.html ------ page2.html ---
原文出自： 转载请保留原文链接： /blog/cache/detail_1066.html
