一.cookie长什么样

打开chrome控制台，我们可以查看cookie

chrome控制台

Name //名称
Value  //值
Domain = www.jianshu.com //域,设置二级或三级域名，且不能跨域设置
Path = / //路径，一般为“/”表示根目录，"/write"表示子目录
Expire = 2018-03-10T21:32:26.124Z //过期时间（绝对时间）
Max-Age = 36000 //过期时间（相对时间），ie6/7/8有兼容性问题
Secure //只在https下才发送
HttpOnly //不能通过 JS 的 document.cookis 访问

根据过期时间可将cookie分为：
（1）session cookie(临时cookie，关闭浏览器就删除，不设置Expire或Max-Age便生成session cookie，控制台那显示Session)
（2）premanent cookie（持久cookie，到了过期时间才删除，设置Expire或Max-Age便生成premanent cookie，控制台那显示时间）

二.通过JS操作cookie

1.用JS获取cookie

（1）在控制台输入document.cookie便可获取cookie：

"read_mode=day; default_font=font2; _ga=GA1.2.1886567652.1502162633; locale=zh-CN; Hm_lvt_0c0e9d9b1e7d617b3e6842e85b9fb068=1520563415,1520576927,1520586845,1520586886; sensorsdata2015jssdkcross=%7B%22distinct_id%22%3A%2215f32c9cfcb464-090a5a34d92563-31677c00-2073600-15f32c9cfcc64e%22%2C%22%24device_id%22%3A%2215f32c9cfcb464-090a5a34d92563-31677c00-2073600-15f32c9cfcc64e%22%2C%22props%22%3A%7B%22%24latest_traffic_source_type%22%3A%22%E7%9B%B4%E6%8E%A5%E6%B5%81%E9%87%8F%22%2C%22%24latest_referrer%22%3A%22%22%2C%22%24latest_referrer_host%22%3A%22%22%2C%22%24latest_search_keyword%22%3A%22%E6%9C%AA%E5%8F%96%E5%88%B0%E5%80%BC_%E7%9B%B4%E6%8E%A5%E6%89%93%E5%BC%80%22%7D%2C%22first_id%22%3A%22%22%7D; Hm_lpvt_0c0e9d9b1e7d617b3e6842e85b9fb068=1520691212"

可见，返回的是一个字符串(编码状态，需用decodeURIComponent()进行解码)，字符串中的每一个都是名值对，每一个名值对都用；隔开

（2）如果要获取特定名称的cookie的value时，可用以下的方法：

// 例：name1=value1;name2=value2;name3=value3
// （1）使用普通方法
function getCookie(cname) {
    var name = cname + "=";
    var decodedCookie = decodeURIComponent(document.cookie); //解码
    var ca = decodedCookie.split(';');
    for(var i = 0; i<ca.length ; i++) {
        var c = ca[i];
        while(c.charAt(0) == ' ') {
            c = c.substring(1);
        }
        if(c.indexOf(name) == 0){
            return c.substring(name.length, c.length);
        }
    }
    return "";
}
getCookie('name1'); //返回value1

// （2）使用正则表达式
function getCookie(name) {
    var decodeCookie = decodeURIComponent(document.cookie);
    var reg = new RegExp(name+'=(.*?);')；
    var ret = reg.exec(decodeCookie)；
    return ret[1]；
}
getCookie('name1'); //返回value1

2.用JS增加cookie

用赋值语句来增加cookiie

// （1）简单案例（只用于说明，不推荐，详见（2）一般用法）
// cookie：name1=value1;name2=value2;name3=value3
 document.cookie = "username = mike"
// cookie：name1=value1;name2=value2;name3=value3;username=mike

// （2）一般用法（需进行编码）
 document.cookie = encodeURIComponent('username') + '=' +
                   encodeURIComponent('mike') + //编码
                   '; domain=www.jianshu.com' +  //添加属性
                   '; expires=' + new Date('2030-1-1');

3.用JS删除cookie

给cookie赋值一个过去的时间来实现删除

 document.cookie = encodeURIComponent('username') + '=' +
                   encodeURIComponent('mike') + 
                   '; domain=www.jianshu.com' +  
                   '; expires=' + new Date(0);  // 设置一个过去的时间(1970-1-1)