JavaScript 客户端存储之创建cookie + 读取cookie + 删除cookie_jscookie的存储,删除

1、创建 cookie （无过期时间）

• 创建一个名为 username 的 cookie ,它的值为 Jack;
• 注意 ：一个创建表达式，只能创建一个cookie ,不能后面接着定义下一个cookie
• 如果不设置 过期时间，浏览器关闭的时候 cookie 就会被删除

    // 创建一个 username cookie ,它的值为 Jack;
    document.cookie = "username=Jack";
    //创建一个 age cookie ,它的值为 18;
    document.cookie = "age=18";

    //错误：
    //document.cookie = "username=Jack; age=18";
    
1
2
3
4
5
6
7
8
9

2、创建 cookie （附加过期时间）

• expires 后面添加过期时间；
• 注意：时间格式要转为 UTC 或 GMT 格式；

    var date = new Date().getTime();
    // 设置30天后过期
    var nd = new Date(date + 30*60*60*60*1000);
    document.cookie = "username=Jack; expires=" + nd.toUTCString();
    
1
2
3
4
5
6

3、读取cookie

	// 读取cookie
    // 获取的是cookie 字符串; 如：username=Jack; age=18
    // 根据正则，获取你想要的值
    var cookies = document.cookie;
    
1
2
3
4
5
6

4、删除 cookie

• cookie 的删除途径比较别致，通过修改 " 过期时间 " ，让浏览器删除cookie,
• 所以，等浏览器关闭 再次打开后 过期的 cookie 就不在了，

   var date = new Date().getTime();
    // 设置为昨天
    var nd = new Date(date + (-1)*60*60*60*1000);
    document.cookie = "username=Jack; expires=" + nd.toUTCString();
1
2
3
4

5、封装 cookie的增、删、改、查操作

    // name:键，value:值，expiresDays:过期天数
    // 功能：创建, 修改 
    function setCookie(name, value, expiresDays) {
      var date = new Date().getTime();
      var nd = new Date(date + expiresDays * 60 * 60 * 60 * 1000);
      document.cookie = name + "=" + value + "; expires=" + nd.toUTCString();
    }

    function getCookie(name) {
      var cookies = document.cookie;
      // 将字符串 以 ; 分隔，
      var carr = cookies.split(';');
      for (var i = 0; i < carr.length; i++) {
        var str = carr[i];
        // 去除字符串前面的空格符
        while(str.charAt(0) == ' ') str = str.substring(1);
        // 截取字符串 = 后面的值
        if(str.indexOf(name) != -1)
          return str.substring(name.length+1,str.length);
      }
      // 没有找到就返回 空字符串
      return "";
    }

    // 清除cookie
    function clearCookie(name){
      // 设置过期时间
      setCookie(name,"",-1);
    }
    
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31