Web存储

目录

什么是 HTML5 Web 存储?

方法

webStorage

会话存储 sessionStorage

本地存储localStorage


什么是 HTML5 Web 存储?

使用HTML5可以在本地存储用户的浏览数据。

早些时候,本地存储使用的是 cookie。但是Web 存储需要更加的安全与快速. 这些数据不会被保存在服务器上,但是这些数据只用于用户请求网站数据上.它也可以存储大量的数据,而不影响网站的性能.

数据以 键/值 对存在, web网页的数据只允许该网页访问使用。

方法




  
  
  
  Document
  


  

这个页面我们先不关闭,再来创建一个html网页,使用cookie存储数据,打开第二个页面




  
  
  
  Document
  


  

Web存储_第1张图片

我们发现cookie中两个网页的存储信息都能得到,可以得出cookie存储的特点为:

产生于服务器,保存在客户端,同一服务器的cookie数据是共享的,数据最大不超过4KB

webStorage

会话存储 sessionStorage




  
  
  
  Document


  

   

我们关闭网页后,将存数据的两行代码注释掉(不注释得话再次打开网页相当于又存数据),再次打开网页,可以发现数据已经没了

会话存储的特点为:针对于选项卡和浏览器,当选项卡和浏览器关闭时,会话就失效,数据可以达到5-10MB

本地存储localStorage




  
  
  
  Document


  

我们关闭网页后,将存数据的两行代码注释掉(理由同上),再次打开网页,发现数据还是存在。

Web存储_第2张图片

本地存储的特点为:将数据存储到本地,即使关闭浏览器和选项卡数据依然存在,除非手动删除,数据可以达到5-10MB

你可能感兴趣的:(前端,html)