使用js实现对cookie的增删改查

​简单的操作cookie

存储cookie(key为test；value为testValue): 

document.cookie = "test=testValue";

存储多个cookie：

document.cookie = "test1=testValue1";
document.cookie = "test2=testValue2";

获取cookie：

var getCookie = document.cookie;

设置cookie：

//设置cookie
function setCookie(cookieName, cookieValue) {
    var expires = "1"; //过期时间,此处设置有效期为1天
    var exp = new Date();
    exp.setTime(exp.getTime() + expires * 24 * 60 * 60 * 1000); //设置失效时间（不设置的话，浏览器关闭后此cookie将丢失）
    document.cookie = cookieName + "=" + escape(cookieValue) + ";expires=" + exp.toGMTString() + ";path=" + "/";
}

注：由于在cookie的名或值中不能使用分号（;）、逗号（,）、等号（=）以及空格。

而在cookie的名中我们可以控制，但要保存的值是不确定的，怎么办呢？

这时就需要用escape()函数进行编码，它能将一些特殊符号使用十六进制表示，例如空格将会编码为“20%”，从而可以存储于cookie值中，而且使用此种方案还可以避免中文乱码的出现，取的时候用unescape()函数解码即可。

修改cookie:需要修改cookie时，只需要重新复制即可。

获取cookie:

//读取cookie
function getCookie(cookieName){ 
	var arr,reg=new RegExp("(^| )"+cookieName+"=([^;]*)(;|$)");
	if(arr=document.cookie.match(reg))
		return unescape(arr[2]); 
	else 
		return null; 
}

注：当存入多个cookie时，使用document.cookie读取时会全部取出来，可能我们只是想获取其中一个（如：test1），这样的结果不是我们想要的，因此用到了new RegExp()来帮我们过滤，同时使用match()函数来获取到最终的值,由于存的是编码后的值，所以需要通过unescape()来进行解码即可得到我们想要的结果。

删除cookie：

其实删除cookie说白了就是设置cookie的过期时间为过去的一个时间，即让cookie过期。

//删除cookie
function delCookie(cookieName ){ 
	var exp = new Date(); 
	exp.setTime(exp.getTime() - 1); 
	var cval=getCookie(cookieName ); 
	if(cval!=null) 
		document.cookie= cookieName  + "="+cval+";expires="+exp.toGMTString()+";path="+"/"; 
}

设置可访问cookie的路径：

cookie_dir表示可以访问cookie的目录，使用path属性可设置其值(设置仅在test目录下可用)：

document.cookie="cookieName=cookieValue; path=/test";

注：path="/"表示cookie在整个网站下都可用

设置cookie域：

domain表示cookie所在域，默认为请求的地址,并且默认情况下一个主机中创建的cookie在另一个主机下是不能被访问的。

如：网址test1.test.com要访问test2.test.com下的cookie可设置domain参数来实现

document.cookie="cookieName=cookieValue;domain=.test.com";

本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！

链接: https://shenqiku.cn/article/FLY_5361