Web Storage是HTML5中新增的除Canvas元素以外,非常非常重要的功能!没有之一!顾名思义,其就是在Web端存储数据的功能,当然这里的存储只是针对客户端本地而言的。
Web Storage的优缺点:优点:
存储空间更大。在IE下每个独立存储空间为10M,其它浏览器存储空间略有不同,但可以肯定的是至少要比cookie要大很多。
存储内容不会与服务器发生任何交互,数据仅仅单纯地存储在本地。不用担心对服务器数据的影响!
独立的存储空间,每个域都有自己独立的存储空间,各个存储空间又完全是独立的,所以不会对数据千万混乱。
缺点:
存储在本地的数据未加密且永远不会过期,容易造成隐私泄漏!
存储的数据类型只能是字符串!(也勉强算是个不是问题的小问题吧)
localStorage与sessionStorage
localStorage与sessionStorage是Web Storage提供的两种存储在客户端的方法。
localStorage:没有时间限制的存储方式。存储的时间可以是一天,二天,几周或几十年!关闭浏览器数据不会随着消失,当再次打开浏览器时,数据依然可以访问!也就是说除非你主动删除数据,否则数据是永远不会过期的。
sessionStorage:保存在session对象当中。用来保存的时间为用户与浏览器的会话时间。即从浏览页面到关闭浏览器为一个会话时间。关闭浏览器,所有的 session数据也会消失!
localStorage是永久保存数据,sessionStorage是暂时保存数据,这是两者之间的重要区别!
sessionStorage设置和获取数据
localStorage设置和获取数据
注意事项:
Web Storage是window对象的子对象。
localStorage.length或sessionStorage.length为相应的数据条数
localStorage.key(index):将数据的索引值作为参数传入,可以得到localStorage中与这个索引号相对应的数据。sessionStorage.key(index)同理!故省略!
localStorage.removeItem("key"):清除指定的localStorage数据。 sessionStorage.removeItem("key"):清除指定的localStorage数据。
localStorage.clear():清除所有保存在localStorage的数据。sessionStorage.clear():清除所有保存在sessionStorage的数据。
领取专属 10元无门槛券
私享最新 技术干货