cookie的增删改查

添加cookie，默认路径：在当前目录下 默认有效期：浏览器存续期间

document.cookie = "username=abc";

设置cookie的有效期和路径
①expires设置有效期

let oDate = new Date();
//7天之后的日期
oDate.setDate(oDate.getDate() + 7);
document.cookie = "username=abc;expires=" + oDate;

②路径设置

let oDate = new Date();
oDate.setDate(oDate.getDate() + 7);
document.cookie = "username=abc;expires=" + oDate + ";path=/";

③同名cookie会覆盖

document.cookie = "user=aaa";
document.cookie = "user=bbb";//user同名，因此aaa被覆盖为bbb

④cookie大小在4k左右，cookie条数在170条左右

for (var i = 0; i < 200; i++) {
document.cookie = i + "=a" + i;
}
//遍历所有的cookie

获取cookie

console.log(document.cookie);//直接获取所有的cookie

//取单个cookie的值
document.cookie = "user=abc";
document.cookie = "user2=def";
document.cookie = "user3=ghi";

let strCookie = document.cookie;
let arrCookie = strCookie.split("; ");//把字符串分割成字符串数组
console.log(arrCookie);

for (var i = 0; i < arrCookie.length; i++)
{
let arr = arrCookie[i].split("=");//将第i条cookie从=的地方开始分割（如第二条cookie是user2=def，则从=开始分割为user2和def。arr[0]是user2，arr[1]是def）
if (arr[0] == "user") //选中cookie是user的
{
console.log(arr[0]);//输出user
console.log(arr[1]);//输出abc，和上一条之间用=连接
}
}

删除cookie

let oDate = new Date();
oDate.setDate(oDate.getDate() - 7);
document.cookie = "user=suibian;expires=" + oDate;
//原理是利用同名覆盖，因为如果cookie的有效期比当前时间还早的话就会失效，而将要删除的cookie覆盖上一个有效期比当前时间还早的cookie就起到了删除效果

cookie存值和取值都是字符串

document.cookie = "data=111";
let data = { a: 1, b: 2 };
document.cookie = "data=" + data;
//如果存的值是一个JSON对象就要提前转成json字符串，需要通过JSON.stringify()
//如果取的值是一个json字符串，需要用JSON.parse()转成json对象进行进一步处理
console.log(JSON.stringify({ a: 1 }));
console.log(JSON.parse('{"a":1}'));