1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6 <script src="js/jquery-1.12.3.js"></script>
7 <script src="js/jquery.cookie.js"></script>
8 <script>
9 $(function(){
10
11 //cookie
12 //JS-cookie
13 //document.cookie = "name=value; expires=过期日期;path=访问路径;domain=域名;secure";
14 //JQ-cookie
15 //$.cookie("name","zhangsan", {expires:7,path:"/"});
16
17 //添加cookie
18 $.cookie("name","zhangsan", {expires:7,path:"/"});
19
20 //修改cookie
21 //自动URI编码/解码
22 $.cookie("name", "张三", {expires:7, path:"/"});
23
24 //获取cookie
25 console.log( $.cookie("name") ); //张三
26
27 //删除cookie
28 //将expires设置为0或负数
29 $.cookie("name", "", {expires:-1, path:"/"});
30 console.log( $.cookie("name") ); //undefined
31
32
33 //存储对象
34 var obj = {
35 name: "张三",
36 age: 33
37 }
38 $.cookie("person", obj, {expires:30, path:"/"});
39 console.log( $.cookie("person") ); //"[object Object]"
40 console.log( typeof $.cookie("person") ); //string
41
42 //JSON序列化： JSON.stringify() 将对象转换为字符串
43 //JSON解析：JSON.parse() 从字符串中解析出json对象
44 $.cookie("person", JSON.stringify(obj), {expires:30, path:"/"});
45 console.log( $.cookie("person") ); //"{"name":"张三","age":33}"
46 console.log( JSON.parse($.cookie("person")).name ); //张三
47
48
49 //存储数组
50 var arr = [];
51 arr.push({name: "张三", age:33});
52 arr.push({name: "李四", age:44});
53 arr.push({name: "王五", age:55});
54
55 //将arr进行序列化后再存储
56 $.cookie("persons", JSON.stringify(arr), {expires:30, path:"/"});
57 console.log( $.cookie("persons") );
58 //"[{"name":"张三","age":33},{"name":"李四","age":44},{"name":"王五","age":55}]"
59
60
61 })
62 </script>
63 </head>
64 <body>
65 </body>
66 </html>
