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中