js中对cookie的操作及json数据与cookie结合的用法

cookie的使用
添加cookie
添加cookie：document.cookie = “key=value”; // 一次写入一个键值对
document.cookie = 'test1=hello';
document.cookie = 'test2=world';
//在浏览器中查看一下现在的cookie是什么样子   打开控制台 点击application 就能看到cookies
//注意 document.cookie一次只能写入一个 Cookie，而且写入并不是覆盖，而是添加
读取cookie
读取cookie：document.cookie;
document.cookie // "test1=hello; test2=world"
上面代码从document.cookie一次性读出两个 Cookie，它们之间使用 分号空格 分隔。必须手动还原，才能取出每一个 Cookie 的值。
var cookies = document.cookie.split('; ');
for (var i = 0; i < cookies.length; i++) { 
      console.log(cookies[i]);
}
// foo=bar// baz=bar
修改cookie
修改cookie：document.cookie = “key=value”;  // 修改名为key的cookie值
document.cookie = 'test2=hah';
document.cookie // "test1=hello; test2=hah"

上面代码修改了test2对应的值
失效时间：expires
失效时间：expires ，没有设置失效时间的cookie 在浏览器关闭以后就会自动删除，如果设置了失效时候在未来的时间，就可以让cookie保存的时间长一点
设置失效时间：document.cookie = “key=value;expires=”+ oDate;
var oDate = new Date();
oDate.setDate(oDate.getDate() + 7);
document.cookie = “key=value;expires=”+ oDate;
//上面代码设置cookie的过期时间为7天以后
删除cookie
删除cookie：将cookie值覆盖为空，并将失效时间设置为过去的时间。
var oDate = new Date();
oDate.setDate(oDate.getDate() -7);
document.cookie = “test=;expires=”+ oDate;
//将cookie的过期时间设置为 7天前，test 这个cookie 就获取不到了

设置域名：domain
设置域名：document.cookie = “key=value;domain=www.baidu.com“;
注：必须在绑定域名的服务器才可以设置域名，上不同服务器之间的cookie文件不能共享。

设置路径：path
设置路径： document.cookie = “key=value;path=/“;
注：在同一路径下的网页可以共享cookie，路径不同时，不可以访问。
document.cookie = “key=value;path=/“;//设置cookie的路径为根路径，这样我们网站下的所有页面可以共享cookie
注：如果有中文内容，需要用encodeURIComponent(‘xxxx’)进行编码，再使用decodeURIComponent(‘xxxx’)进行解码，解决中文乱码的问题。

6：cookie的封装
增加/修改cookie函数：
function setCookie(name,value,iDay){
    var newDate = new Date();
    newDate.setDate(newDate.getDate()+iDay);
//编码  把可能为中文的编码一下
     console.log(name)
    value = encodeURIComponent(value);
    console.log(name)

    document.cookie=name+"="+value+";expires="+newDate+";path=/";
}

获取cookie函数：
function getCookie(name){
     //解码
    cookie = decodeURIComponent(document.cookie);
    var arr = cookie.split("; ");
    for(var i =0; i<arr.length; i++){
        var arr2 = arr[i].split("=");
        if(arr2[0] == name){
            return arr2[1];
        }
    }
}

删除cookie函数：
function removeCookie(name){
      setCookie(name,1,-100);
}

 json与cookie

json的值只能是数组或对象，不能是函数、正则表达式对象、日期对象。
字符串必须使用双引号表示，不能使用单引号。
对象的键名必须放在双引号里面。

数组或对象最后一个成员的后面，不能加逗号。
以下都是合法的 JSON。
["one", "two", "three"]
{ "one": 1, "two": 2, "three": 3 }
{"names": ["张三", "李四"] }
[ { "name": "张三"}, {"name": "李四"} ]
以下都是不合法的 JSON。
{ name: "张三", 'age': 32 }  // 属性名必须使用双引号
[32, 64, 128, 0xFFF] // 不能使用十六进制值
{ "name": "张三", "age": undefined } // 不能使用 undefined
{ "name": "张三",
  "birthday": new Date('Fri, 26 Aug 2011 07:13:10 GMT'),
  "getName": function () {
      return this.name;
  }} // 属性值不能使用函数和日期对象
JSON对象是 JavaScript 的原生对象，用来处理 JSON 格式数据。它有两个方法：
JSON.stringify()
JSON.stringify方法用于将一个值转为 JSON 字符串。该字符串符合 JSON 格式，并且可以被
JSON.stringify([1, 1])// '[1,1]'
JSON.stringify({ name: "张三" })// '{"name":"张三"}'
JSON.parse()。
JSON.parse方法用于将 JSON 字符串转换成对应的值。
JSON.parse('{}') // {}
JSON.parse('[1, 5]') // [1, 5]
var o = JSON.parse('{"name": "张三"}');
o.name // 张三
JSON对象是 JavaScript 的原生对象，用来处理 JSON 格式数据。它有两个方法：
JSON.stringify()
JSON.stringify方法用于将一个值转为 JSON 字符串。该字符串符合 JSON 格式，并且可以被
JSON.stringify([1, 1])// '[1,1]'
JSON.stringify({ name: "张三" })// '{"name":"张三"}'
JSON.parse()。
JSON.parse方法用于将 JSON 字符串转换成对应的值。
JSON.parse('{}') // {}
JSON.parse('[1, 5]') // [1, 5]
var o = JSON.parse('{"name": "张三"}');
o.name // 张三

我们可以把js中的对象，转为字符串，存贮在cookie中，从而来存贮复杂的数据
var userObj = {name:"张三",age:18}
var jsonStr = JSON.stringify(userobj);
setCookie('userinfo',jsonStr,7)//把用户的信息存储在cookie中
var arr = [
{name:"张1",age:18},
{name:"张2",age:18},
{name:"张3",age:18}
]
var jsonStr = JSON.stringify(arr);
setCookie('users',jsonStr,7)//把多个账户息存储在cookie中