Web存储

HTML5 web 存储,一个比cookie更好的本地存储方式。

使用HTML5可以在本地存储用户的浏览数据。早些时候,本地存储使用的是cookies。但是Web 存储需要更加的安全与快速. 这些数据不会被保存在服务器上，但是这些数据只用于用户请求网站数据上.它也可以存储大量的数据，而不影响网站的性能.数据以键/值对存在, web网页的数据只允许该网页访问使用。Cookies从JavaScript出现之初就一直存在，所以在Web上存储数据并不是个新概念。不过Web存储是数据存储的一种更为强大的版本，可提供更多的安全性、速度和易用性。在Web存储中还可以存储数量巨大的数据。具体的数量则取决于Web浏览器，但通常都在5MB到10MB之间，这对于一个 HTML应用程序而言已经足够大。另一个好处是此数据并不会在每次出现服务器请求时都被加载。惟一的限制是不能在浏览器之间分享Web存储, 如果您在Safari中存储了数据，那么该数据在Mozilla Firefox中是无法访问的。

Web存储有两种方式：localStorage和sessionStorage两种方式

localStorage对象：负责存储没有到期的数据。当Web页面或浏览器关闭时，仍会保持数据的存储，当然这还取决于为此用户的浏览器设置的存储量，存储的数据没有时间限制，第二天、第二周或下一年之后，数据依然可用。

例子：

 1 <script>
 2 function clickCounter()
 3 {
 4 if(typeof(Storage)!=="undefined")
 5   {
 6   if (localStorage.clickcount)
 7     {
 8     localStorage.clickcount=Number(localStorage.clickcount)+1;
 9     }
10   else
11     {
12     localStorage.clickcount=1;
13     }
14   document.getElementById("result").innerHTML="You have clicked the button " + localStorage.clickcount + " time(s).";
15   }
16 else
17   {
18   document.getElementById("result").innerHTML="Sorry, your browser does not support web storage...";
19   }
20 }
21 </script>

该例子是记录鼠标点击的次数的，可以长期的存储，即使关闭浏览器也不会的计数产生影响。

sessionStorage对象：负责存储一个会话的数据。如果用户关闭了页面或浏览器，则会销毁数据。

例子：

 1 <script>
 2 function clickCounter()
 3 {
 4 if(typeof(Storage)!=="undefined")
 5   {
 6   if (sessionStorage.clickcount)
 7     {
 8     sessionStorage.clickcount=Number(sessionStorage.clickcount)+1;
 9     }
10   else
11     {
12     sessionStorage.clickcount=1;
13     }
14   document.getElementById("result").innerHTML="You have clicked the button " + sessionStorage.clickcount + " time(s) in this session.";
15   }
16 else
17   {
18   document.getElementById("result").innerHTML="Sorry, your browser does not support web storage...";
19   }
20 }
21 </script>

当用户关闭浏览器窗口后，数据会被删除。

HTML5使用local storage存储的数据是如何保存在本地的？（我使用的是chrome浏览器，chrom浏览器是用sqlite来保存本地数据的）

HTML5 的local storage 是通过浏览器在本地存储的数据。

基本使用方法如下：

<script type="text/javascript">
localStorage.firstName = "Tom";
alert(localStorage.firstName);
</script>

这样的话，就将数据保存到本地了，但是本地数据是以什么形式进行保存的呢，经过跟踪，发现在Chrome浏览器中，数据是以sqlite的数据库文件形式存储的。

在windows下，是保存在C:Documents and SettingsUser NameLocal SettingsApplication DataGoogleChromeUser DataDefaultLocal Storage 路径(其中User Name是指当前的用户名)下的；

在Mac下，是保存在/Users/User Name/Library/Application Support/Google/Chrome/Default/Local Storage路径(其中User Name是指当前的用户名)路径下的

虽然后缀名是.localstorege 但是实际上就是sqlite的数据库文件，可以用sqlite打开，并看到其中的数据。（可以使用firefox的SQLite Manager附加组件打开）

努力吧，为了媳妇儿，为了家。。。