HTML5新特性(二)-存储

一.新增h5存储

cookies与localStorage、sessionStorage区别?

  • cookies:
  1. 存储空间小,4Kb;
  2. api封装麻烦;
  3. cookies在浏览器和服务器中传递;
  4. 有有效期
  • localStorage:
  1. 存储空间大,5Mb;
  2. api封装简单
  3. localStorage只在本地存储
  4. 一直存在
  • sessionStorage
  1. 同localStorage
  2. 关闭窗口消失。

二. 封装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();
				}
			})());

猜你喜欢

转载自blog.csdn.net/jeft_hai/article/details/82490565