一.新增h5存储
cookies与localStorage、sessionStorage区别?
- cookies:
- 存储空间小,4Kb;
- api封装麻烦;
- cookies在浏览器和服务器中传递;
- 有有效期
- localStorage:
- 存储空间大,5Mb;
- api封装简单
- localStorage只在本地存储
- 一直存在
- sessionStorage
- 同localStorage
- 关闭窗口消失。
二. 封装localStorage
封装原因:键值对方式存储,key值容易重叠,添加前缀防止冲突。
- localStorage.setItem 存储数据信息到本地
- localStorage.getItem 读取本地存储的信息
- localStorage.removeItem 删除本地存储的信息
- localStorage.clear 清空所以存储的信息
window.UtilStorage = (new (function(){
var prefix = 'prefix'; // 防止key值重叠
var storage;
if(window.localStorage){ // 兼容处理
storage = window.localStorage;
}else{
storage = window.cookieStorage;
}
this.set = function(key,val){
storage.setItem(prefix + key, val);
}
this.get = function(key){
storage.setItem(prefix + key);
}
this.remove = function(key){
storage.removeItem(prefix + key);
}
this.clear = function(){
storage.clear();
}
})());