前端本地存储

1、cookie 储存

cookie 容量很小，所有浏览器都支持，但容量只能存 4KB 大小的数据，用法用 document.cookie 来设置，如果同名会覆盖掉原有的数据，获取也是同样 document.cookie，多个数据会以分号分隔全部返回;

	document.cookie = 'name=xian';
	document.cookie = encodeURIComponent('age') + '=' + encodeURIComponent(25);  // 去掉空格方式
	console.log(document.cookie)

获取到的数据是  "name=xian; xage=25"

2、localStorage 和 sessionStorage H5新增的方法，要IE8以上的浏览器才有

2.1localStorage 用此方法保存的数据只要没有清除浏览器的缓存或者删除浏览器，数据都会一直存在，

使用方法 

   window.localStorage.setItem('name1','aaa');  //或者 
	localStorage['name2'] = 'xxx'
	// 获取方法
	window.localStorage.getItem('name1'); //或者
	localStorage['name2']
   //删除方法
	localStorage.removeItem('name2')

 2.2  sessionStorage 保存方法是会话级的，关闭浏览器一阵后会自动消失

 使用方法

	//设置
	sessionStorage.setItem('name1','aaa'); //或者
	sessionStorage['name2'] = 'xxx';
	
	//获取
	window.sessionStorage.getItem('name1');

	//删除
	sessionStorage.removeItem('name1');

注意 ： 如果保存的数据是对象一定要用 JSON.stringify(obj) 转成字符串，不然后保存的是 [obj];

以下是一组现成的使用方法，可直接使用，

save 是保存数据，item 是数据名，str 是要保存的数据，type 不写是保存 localStorage，写上是保存 sessionStorage

get 是获取方法 ，item 是数据名，type 不写是获取 localStorage 数据，写上是获取 sessionStorage 数据

remove 是删除方法，item 是数据名，type 同上

extend 是合并数据，old 是原数据，newObj 是要合并进原数据的对象，cover 是如果有重名的是否覆盖原有的参数

updata 是在原有的数据上修改合并数据，item 是修改的数据名，addObj 是要新增或者修改对象中的数据，type 同上，实际是用 extend 把两数据合并在一起然后再保存

var conf = {
	save : function(item,str,type){
		var type=type||0;
		if(typeof(str)=="object"){
			var str=JSON.stringify(str)
		}
		if(type){
			sessionStorage.removeItem(item);
			sessionStorage[item]=str
		}else{
			localStorage.removeItem(item);
			localStorage[item]=str
		}
	},
	get : function(item,type){
		var value=null,type=type||0;
		if(type){
			if(sessionStorage[item]!==undefined){
				value=sessionStorage[item];
				if(value.indexOf("{")==0||value.indexOf("[")==0){
					value=JSON.parse(value)
				}
			}
			return value
		}else{
			if(localStorage[item]!==undefined){
				value=localStorage[item];
				if(value.indexOf("{")==0||value.indexOf("[")==0){
					value=JSON.parse(value)
				}
			}
			return value
		}
	},
	remove : function(item,type){
		var type=type||0,
			item=item||-1;
			if(type){
				if(item==-1){
					sessionStorage.clear();
				}else{
					sessionStorage.removeItem(item);
				}
			}else{
				if(item==-1){
					localStorage.clear();
				}else{
					localStorage.removeItem(item);
				}
			}
	},
	update : function(item,addObj,type){
		var type=type||0;
		if(type){
			if(this.get(item,1)==null){
				this.save(item,addObj,1)
			}else{
				var value=JSON.parse(sessionStorage[item]);
					value=this.extend(value,addObj,1);
					sessionStorage[item]=JSON.stringify(value)
			}
		}else{
				if(this.get(item)==null){
					this.save(item,addObj)
				}else{
					var value=JSON.parse(localStorage[item]);
					value=this.extend(value,addObj,1);
					localStorage[item]=JSON.stringify(value)
				}
			}
	},
	extend : function(old, newObj, cover){
		if(old instanceof Array){
			old = old.concat(newObj);
		}else{
			for(var p in newObj){
				//    cover 存在就覆盖原有的字段，不存在原有的就有变）
				if(newObj.hasOwnProperty(p) && (!old.hasOwnProperty(p) || cover)){
					old[p] = newObj[p];
				}
			}
		}
		return old;
	}
}