HTML5之Web Storage

WebStorage的出现是为了弥补cookie的不足,cookie一方面是容量小,4k/8k,存几个电子邮件都不够,二来是全局的,容易被误用,盗用。

在HTML5中网络存储按照生命周期分为2种,一种是基于会话(session),这种存储周期只是当前会话,当网页[注1]被关被后,或者被转到其他网站后,存储也就被销毁;

  1. sessionStorage.varName = “生成新变量”;   
  2. sessionStorage.varName = “变量操作”;   
  3. delete sessionStorage.varName;  //删除变量  
sessionStorage.varName = “生成新变量”;
sessionStorage.varName = “变量操作”;
delete sessionStorage.varName;  //删除变量

另外一种是本地存储,当网页下次被打开的时候,你仍然可以访问上次打开该网页时存储的数据,比如本地存储的网站用户名就可以使用这种方式。
用法和基于会话的存储一样,只是前缀名改成了localStorage

  1. localStorage.varName = “生成新变量”;   
  2. localStorage.varName = “变量操作”;   
  3. delete localStorage.varName;  //删除变量  
localStorage.varName = “生成新变量”;
localStorage.varName = “变量操作”;
delete localStorage.varName;  //删除变量

从上面可以看出web storage其实也只是解决了轻量级的数据存储问题,如果是大量的数据查询,比如商品列表,还是得靠数据库,HTML5中有Web Database来支持这一操作,基本操作和SQL一致。
注1:现在的浏览器基本都支持多窗口了,一个窗口对应一个网页
注2:官方参考

相关推荐