JS创建、获取、删除 cookie 方法

js 创建 cookie 方法

// 没有设置 cookie 过期时间的话，默认是 会话cookie(浏览器关闭时，该cookie失效，被删除)
document.cookie = cname + "=" + value;
// 设置了过期时间的话，在设置的时间段内 cookie 一直存在有效，到达过期时间点时，cookie被删除而失效
document.cookie = cname + "=" + value + ";expires=" + expiresTime;

还可以设置 cookie 的 “path”，不设置的话，默认是 “path=/”，更多信息请上网查询

js 获取 cookie 方法

document.cookie;   // 会获取所有 cookie 值，以 ‘;’ 分隔，具体 cookie值 需要 再进行一下处理来获取

js 删除 cookie 方法

不用设置 cookie 值，将过期时间设置为过去时间即可

document.cookie = cname + "=;expires=" + 过去时间;
// 例如：
var edate = new Date();
document.cookie = "testCookie=;expires=" + (edate.getTime() - 1).toUTCString();

代码示例

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>cookie</title>
</head><body><button id="setCookie" class="setCookie">点击设置cookie</button><button id="getCookie" class="getCookie">点击获取cookie</button><button id="removeCookie" class="removeCookie">点击删除cookie</button><script>window.onload = function () {// 设置cookievar btn1 = document.getElementById('setCookie');var btn2 = document.getElementById('getCookie');var btn3 = document.getElementById('removeCookie');// 设置 cookiebtn1.onclick = function () {setCookie('testCookie', '111');setCookie('testCookie2', '222', 120);}// 获取 cookiebtn2.onclick = function () {var c1 = getCookie('testCookie');var c2 = getCookie('testCookie2');console.log(c1, c2);}// 删除 cookiebtn3.onclick = function () {setCookie('testCookie', null); // 这种不能删除 cookie，只是将 cookie值设置成了null，获取cookie会得到一个 'null' 的 字符串值setCookie('testCookie', ''); // 这种是将 cookie 值设置成 空，没有删除 cookiesetCookie('testCookie2', '', -1);  // 这种 会将 cookie 在浏览器中删除，设置超时时间为过去时间}function setCookie(cname, value, seconds) {var edate = new Date();edate.setTime(edate.getTime() + (seconds * 1000));var cData = cname + "=" + value;cData += (seconds == null) ? '' : (';expires=' + edate.toUTCString());// console.log(cData);  可以F12控制台查看 cookie值document.cookie = cData;}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 "";}}</script>
</body></html>

分别点击 “设置cookie”、“获取cookie”、“删除cookie” 按钮，控制台打印结果如下：

可以看到浏览器 cookie 中有了设置的 cookie值：

2分钟后刷新浏览器，可以看到 “testCookie2” 不存在了，因为设置的 2分钟过期时间到了，删除掉了，“testCookie” 还在，关掉浏览器后，“testCookie” 就不在了：

“testCookie2” 过期之前关闭浏览器，再打开浏览器查看该页面，“testCookie2” 还在，但是 “testCookie” 不在了：

如果设置 cookie值为 null，不会将 cookie 删除，设置 cookie值为 ‘’ 空字符串也不会删除，只是值为空：

JS创建、获取、删除 cookie 方法相关推荐

js设置获取删除cookie
/* cookie 会有一个过期时间,如果不设置过期时间那么关闭页面就会消失,如果想要删除这个cookie的话就要设置一个过期时间,存储大小只有4kb左右设置无过期时间: document.cooki ...
删除浏览器浏览器删除cookie方法
上班之余抽点时光出来写写博文,希望对新接触的朋友有帮助.今天在这里和大家一起学习一下删除浏览器文章目录导航适用范围及演示工具什么是cookie? cookie有什么作用? ie6/ie7/ie8 ...
PHP 删除COOKIE 方法
PHP 删除COOKIE 方法首先我们看一下php手册中关于删除cookie的说明 ------以下引用php手册内容-------------- bool setcookie ( string n ...
js 获取删除cookie
获取cookie function getCookie(name){let reg=RegExp(name+'=([^;]+)');let arr=document.cookie.match(reg) ...
JS 创建自定义对象的方法
工厂模式优点:接受参数,可以无数次的调用这个函数,创建Person对象,而每次他都可以返回一个包含三个属性一个方法的对象. 缺点:虽然解决了创建多个相似对象的问题,但是没有解决对象识别的问题(即怎么 ...
php 删除cookie方法详解
我们先来看下相关cookie的机制. 复制代码代码如下: bool setcookie ( string name [, string value [, int expire [, string pa ...
C# 删除 Cookie 方法
var user = new HttpCookie("UserInfo"); user.Values["UserID"] = Model.ID.ToString ...
JS中获取contextPath的方法
参考:https://hanzhdy.iteye.com/blog/2261832 https://blog.csdn.net/xb12369/article/details/46416845 在JS ...
js中获取元素的方法总结
1,根据 ID 获取使用 getElementById() 方法可以获取带有 ID 的元素对象. document.getElementById('id'); 使用 console.dir() 可以 ...