cookie的get、set方法封装

`setCookie` 封装：

原生赋值方法：
document.cookie='name=wk'
在这里插入图片描述

注：cookie在静态页面中是空的，无法使用；必须在web服务器部署下才可以使用。

/*** 设置cookie* @param name 键* @param val 值* @param exday 有效期（天） #有效期并不是必选项，也可以不设置*/
function setCookie (name, val, exday) {let d = new Date()let expires = ''if (exday) {d.setTime(d.getTime() + (exday * 24 * 60 * 60 * 1000))expires = '; expires=' + d.toGMTString()}document.cookie = name + '=' + val + expires
}

`getCookie` 封装：

原生获取cookie方法：
document.cookie
此方法会获取所有的cookie值，封装getCookie 就是为了方便，获取某一个cookie值。

/*** 获取cookie* @param name* @returns {string}*/
function getCookie (name) {let data = ''if (document.cookie) {let arr = document.cookie.split(';')for (let str of arr) {let temp = str.split('=')if (temp[0].replace(/(^\s*)/g, '') === name) {data = unescape(temp[1])break}}} else {console.warn('cookie不存在')}return data
}

清除cookie封装：

原理：
cookie中的键（属性）为expires，设置cookie的有效期。
通过设置cookie的有效期为当前时间之前的时间。

/*** 清除cookie值* @param name*/
function clearCookie (name) {let exp = new Date()exp.setTime(exp.getTime() - 1)let val = getCookie(name)if (val != null) document.cookie = name + '=' + val + ';expires=' + exp.toGMTString()
}

封装方法也可以直接使用MDN封装的docCookies。

cookie的domain、path 属性

整理cookie的常用规则（干货）：

document.cookie=''赋值时，用;分号间隔，只用于添加属性。
document.cookie='name=1;age=2' 这种写法只有name=1可以生效。因为一次只能赋值一个name和value，若多个也只取第一个。
上面的属性都可以在开发者工具中的Application - Storage - cookie 查看。
document.domain：原生查看当前的domain值的方法。
domain属性、path 属性，值必须完全相同，否则都算不同的cookie值。
eg.

document.cookie
// ""document.cookie="name=1;domain=blog.csdn.net;path=/"
// "name=1;domain=blog.csdn.net;path=/"document.cookie
// "name=1"document.cookie="name=2;domain=blog.csdn.net;path=/"
// "name=2;domain=blog.csdn.net;path=/"document.cookie
// "name=2"document.cookie="name=3;domain=csdn.net;path=/"
// "name=3;domain=csdn.net;path=/"document.cookie
// "name=2; name=3"document.cookie="name=4;domain=blog.csdn.net;path=/Dorothy1224"
// "name=4;domain=blog.csdn.net;path=/Dorothy1224"document.cookie
"name=4; name=2; name=3"

在这里插入图片描述
以上规则使用中总结的，如有问题，欢迎大家指正~

附：

cookie的属性值：

name (必要)
要创建或覆盖的cookie的名字 (string)。

value (必要)
cookie的值 (string)。

end (可选)
最大年龄的秒数 (一年为31536e3，永不过期的cookie为Infinity) ，或者过期时间的GMTString格式或Date对象; 如果没有定义则会在会话结束时过期 (number – 有限的或 Infinity – string, Date object or null)。