JS设置cookie、读取cookie、删除cookie

一、什么是cookie，以及cookie的大小限制？

cookie的大小限制

        cookie 是指某些网站为了辨别用户身份、进行session跟踪而储存在用户本地终端上的数据（通常通过加密），服务器可以利用cookie包含信息的任意性来筛选并经常性维护这些信息，以判断在HTTP传输中的状态，cookie最典型的应用是判断注册用户是否已经登录网站，用户可能会得到提示，是否在下一次进入此网站时保留用户信息以便简化登录手续，这些都是cookie的功用，另一个重要应用场景是“购物车”之类的处理，用户可能会在一段时间内在同一家网站的不同页面中选择不同的商品，这些信息都会写入cookie，以便在最后付款时提取信息；
       在进行cookie操作的时候，应该尽量保证cookie个数小于20个，且所有cookie的总大小小于4KB；

二、cookie的操作

var cookie = {
      set: function(key, val, time) { //设置cookie方法
        var date = new Date(); //获取当前时间
        var expiresDays = time; //将date设置为n天以后的时间
        date.setTime(date.getTime() + expiresDays * 24 * 3600 * 1000); //格式化为cookie识别的时间
        document.cookie = key + "=" + val + ";expires=" + date.toGMTString(); //设置cookie
      },
      get: function(key) { //获取cookie方法
        /*获取cookie参数*/
        var getCookie = document.cookie.replace(/[ ]/g, ""); //获取cookie，并且将获得的cookie格式化，去掉空格字符
        var arrCookie = getCookie.split(";") //将获得的cookie以"分号"为标识 将cookie保存到arrCookie的数组中
        var tips; //声明变量tips
        for (var i = 0; i < arrCookie.length; i++) { //使用for循环查找cookie中的tips变量
          var arr = arrCookie[i].split("="); //将单条cookie用"等号"为标识，将单条cookie保存为arr数组
          if (key == arr[0]) { //匹配变量名称，其中arr[0]是指的cookie名称，如果该条变量为tips则执行判断语句中的赋值操作
            tips = arr[1]; //将cookie的值赋给变量tips
            break; //终止for循环遍历
          }
          return tips;
        }
      },
      delete: function(key) { //删除cookie方法
        var date = new Date(); //获取当前时间
        date.setTime(date.getDate() - 1); //将date设置为过去的时间
        document.cookie = key + "=v; expires =" + date.toGMTString(); //设置cookie
      }
    }
    cookie.set("uesr", "sss", 24); //设置为24天过期
    console.log(cookie.get("uesr")); //获取cookie

cookie的路径

       cookie的路径设置：path=URL;如果在域名的子目录创建的cookie，域名及其他同级目录或上级目录是访问不到这个cookie的，而通过设置路径的好处就是可以让域名及域名的子类目录都可以访问到：

document.cookie='cookieName=cookieValue;expires=expireDate;path=/'; 

cookie域

       设置域：domain=siteDomain，这个主要用在同域的情况下共享一个cookie，例如"www.taobao.com" 与 "ued.taobao.com" 两者是共享一个域名"taobao.com"，如果想让"www.taobao.com" 下的cookie被 "ued.taobao.com" 访问，就需要把path属性设置为 "/"，并且设置 cookie 的domain-->

document.cookie='cookieName=cookieValue;expires=expireDate;path=/;domain=taobao.com'；

       domain表示的是cookie所在的域，默认为请求的地址，如网址为www.jb51.net/test/test.aspx，那么domain默认为www.jb51.net。而跨域访问，如域A为t1.test.com，域B为t2.test.com，那么在域A生产一个令域A和域B都能访问的cookie就要将该cookie的domain设置为.test.com；如果要在域A生产一个令域A不能访问而域B能访问的cookie就要将该cookie的domain设置为t2.test.com。

       path表示cookie所在的目录，asp.net默认为/，就是根目录。在同一个服务器上有目录如下：/test/,/test/cd/,/test/dd/，现设一个cookie1的path为/test/，cookie2的path为/test/cd/，那么test下的所有页面都可以访问到cookie1，而/test/和/test/dd/的子页面不能访问cookie2。这是因为cookie能让其path路径下的页面访问。

       浏览器会将domain和path都相同的cookie保存在一个文件里，cookie间用*隔开。

webStorage

       随着web的不断发展，HTML5提供了两个属性window.sessionStorage和window.localStorage,并携带了setItem,getItem,removeItem,clear等方法，使得本地存储数据的方法操作更为简单便利；

参考链接：
js操作cookie方法
js中的cookie的读写操作示例详解
js与cookie的domain和path之间的关系
cookie中的path与domain属性详解