Html5中的本地存储

时间:2021-06-21 03:15:29

Web Storage

web storage页面存储是html5为数据存储在客户端提供的一项重要功能,由于web storage API能够区分会话数据与长期数据。因此,相应API也分为两种:
sessionStorage (保存会话数据)
localStorage (在客户端长期保存数据)
sessionStorage
1、使用sessionStorage保存数据的时间非常短暂,用户打开浏览器时,可以查看操作过程中要求临时保存的数据,一旦关闭浏览器,所有sessionStorage对象保存的数据将全部丢失
sessionStorage对象保存数据的方法:
sessionStorage.setItem(key, value)
一旦键名设置成功,则不允许修改,也不能重复,新增重复的键名值将取代原有重复的键名值。
 
2、使用sessionStorage对象读取被保存的数据:
sessionStorage.getItem( key )

  

localStorage

localStorage可以将数据长期保存在客户端,直至人工清除为止

1、使用localStorage对象保存数据:
localStorage.setItem(key , value)
 
2、使用localStorage获取保存的数据:
localStorage.getItem(key)
 
3、清除localStorage保存的数据
localStorage.removeItem(key)
 
4、清除全部localStorage对象保存的数据
localStorage.clear( )
 
5、localStorage的length属性和key属性
localStorage.length 可以获取当前页面中保存的数据信息的数量
localStorage.key(index)可以获取对应索引值的键值
 
在html5中可以通过localStorage数据与JSON对象的转换,快速实现存储更多数据的功能
对于localStorage而言,大多数桌面浏览器会设置每个来源5MB的限制。Chrome和Safari对每个来源的限制是2.5MB。而ios版Safari和Android版Webkit的限制也是2.5MB

 

详情请查看蓝克比尔