html5的web存储（五）

          web存储，能让你在html5的开发过程中，将数据存储到本地计算机中。此时必须将web存储和cookie区分开来。

（一）web存储和cookie的区别

        Cookie的大小是受限的（4K以内），并且每次你请求一个新的页面的时候cookie都会被发送过去，这将产生很多不必要的操作。HTML5的storage是存储在你的计算机上，网站在页面加载完毕后可以通过Javascript来获取这些数据。html5上能存储的容量也很大。

       总结出web存储的一些特性：

       1. 存储空间更大：IE8下每个独立的存储空间为10M，其他浏览器实现略有不同，但都比Cookie要大很多。

       2. 存储内容不会发送到服务器：当设置了Cookie后，Cookie的内容会随着请求一并发送的服务器，这对于本地存储的数据是一种带宽浪费。而  Web Storage中的数据则仅仅是存在本地，不会与服务器发生任何交互。

       3. 更多丰富易用的接口：Web Storage提供了一套更为丰富的接口，使得数据操作更为简便。

       4. 独立的存储空间：每个域（包括子域）有独立的存储空间，各个存储空间是完全独立的，因此不会造成数据混乱

（二）web存储之sessionSStorage

       sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。

       关闭浏览器（或标签页）后数据就不存在了。但刷新页面或使用“前进”、“后退按钮”后sessionStorage仍然存在。每个窗口的值都是独立的（每个窗口都有自己的数据），它的数据会随着窗口的关闭而消失，窗口间的sessionStorage也是不可以共享的。

       用!!window.sessionStorage;来检测是否有session存储

（三）web存储之localStorage

        local storage把只把数据存储在了客户端使用，不会发送的服务器上（除非你故意这样做）。而且对于某一个域下来说，local storage是共享的（多个窗口共享一个“数据库”）。localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。

       SessionStorage与LocalStorage他们都拥有相同的方法（常用有如下4个，更多信息可参考HTML5 APP）:

1、setItem(key, value)

2、getItem(key)

3、removeItem(key)

4、clear()
 

（四）web存储之DatabaseStorage

       其实就是sqlite数据库，在js中可以像java在本地调用mysql数据库一样的方便，可以自己创建数据库，自己建表，自己往里面增删改数据。

第一步还是要判断一下浏览器是否支持.