众所周知，以往的WEB技术都是使用cookie来保存数据，但容量十分有限，而HTML5 Web Storage则提供了两种在客户端数据存储方式：sessionStorage和localStorage。
其中，sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。因此，关闭页面会导致 sessionStorage 的数据被清除，但刷新或重新打开新页面数据还是存在，如果需要存储的只是少量的临时数据，可以使用sessionStorage，或者做页面间的小交互。
而localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。
sessionStorage 和 localStorage具有相同的方法storage事件，在存储事件的处理函数中是不能取消这个存储动作的。存储事件只是浏览器在数据变化发生之后给你的一个通知。当setItem(),removeItem()或者clear() 方法被调用，并且数据真的发生了改变时，storage事件就会被触发。注意这里的的条件是数据真的发生了变化。也就是说，如果当前的存储区域是空的，你再去调用clear()是不会触发事件的。或者你通过setItem()来设置一个与现有值相同的值，事件也是不会触发的。当存储区域发生改变时就会被触发，这其中包含许多有用的属性：
storageArea: 表示存储类型（Session或Local）
key:发生改变项的key
oldValue: key的原值
newValue: key的新值
url*: key改变发生的URL |
* 注意: url 属性早期的规范中为uri属性。有些浏览器发布较早，没有包含这一变更。为兼容性考虑，使用url属性前，你应该先检查它是否存在，如果没有url属性，则应该使用uri属性
如果调用clear()方法，那么key、oldValue和newValue都会被设置为null。
特别注意的是，在firefox和chrome中存储和读取都是正常的, 但是对storage事件的触发似乎有点问题, 自身页面进行setItem后没有触发window的storage事件, 但是同时访问A.html和B.html, 在A页面中进行 setItem能触发B页面中window的storage事件, 同样的在B页面中进行setItem能触发A页面中window的storage事件. 在IE9中, 页面自身的设值能触发当前页面的storage事件,同样当前页面的设值能触发同一”起源”下其他页面window的storage事件,这看起来似乎更让人容易理解些。
最后，Web Storage与cookie的最大区别，就是存储容量大小的区别。并且，每次你请求一个新的页面的时候cookie都会被发送过去，这样无形中浪费了带宽，另外cookie还需要指定作用域，不可以跨域调用。
而在HTML5 中，数据不是由每个服务器请求传递的，而是只有在请求时使用数据。它使得在不影响网站性能的情况下存储大量数据成为可能。对于不同的网站，数据存储于不同的区域，并且一个网站只能访问其自身的数据。
HTML5 使用 setItem,getItem,removeItem,clear 等方法来存储和访问数据。
//存储数据
function setstorage(key,val){
if(window.localStorage)
localStorage.setItem(key,val);
else
alert('不支持web storage.');
}
//从存储中取数据
function getstorage(key){
if(window.localStorage)
return localStorage.getItem(key);
return '';
}
//清除数据
function clearstorage(key){
if(window.localStorage)
if(key)
localStorage.removeItem(key);
else
localStorage.clear();
else
alert('不支持web storage.');
} |
而对于sessionStorage，上面的例子只不过是将localStorage换成sessionStorage即可。
所以，如果使用HTML5, CSS3, Javascript进行移动应用开发，使用localStorage来存储数据将会是经常的事，
这可以很方便地在页面间跳转，例如：分类页面 -> 新闻条目页面，只要在点击分类页面中某个新闻条目的时候，
将此新闻条目的id保存在localStorage中，然后打开新闻条目页面进行加载，同时从localStorage中取出当前的
新闻条目id，并发送到服务器上取相应数据。