前端很多情况处理数据需要用到 浏览器的存储功能,初级前端估计还在写页面,中级的至少会用到吧,最近我也频繁解除,看来我要进阶了。首先记录一下浏览器查看cookie的位置。

js中local/session 及cookie存储数据-Qui-Note

1.localStorage 创建一个本地存储的 name/value 对 ,大小在5M左右,永久保存数据

// 存储数据 localStorage.setItem
localStorage.setItem("name","张三三")
// 读取数据 localStorage.getItem
aa.innerHTML =  localStorage.getItem('name')
// 删除数据 
localStorage.removeItem 
全部删除 
localStorage.clear()

//检测可支持性
if(!window.localStorage){
//不支持
}else{
console.log(window.localStorage.getItem('name'))
}
			 

2.sessionStorage 创建一个本地存储的 name/value 对 ,大小在5M左右,临时保存数据,随着页面销毁被删除

使用方法同 localStorage

3.cookie  使用 document.cookie 属性来创建 、读取、及删除 cookie 

document.cookie = "username=John Doe"; // 设置 cookies
document.cookie = "username=张三";     // 修改 
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT"; //删除,设置过期就可以删除
///cookies 获取及修改封装	
		
function setCookie(cname,cvalue,exdays){
   var d = new Date();
  d.setTime(d.getTime()+(exdays*24*60*60*1000));
  var expires = "expires="+d.toGMTString();
  document.cookie = cname+"="+cvalue+"; "+expires;
}
function getCookie(cname){
  var name = cname + "=";
  var ca = document.cookie.split(';');
  for(var i=0; i<ca.length; i++) {
    var c = ca[i].trim();
    if (c.indexOf(name)==0) { return c.substring(name.length,c.length); }
 }
 return "";
}