1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <meta http-equiv="X-UA-Compatible" content="ie=edge">
7 <title>Document</title>
8 </head>
9 <body>
10
11 </body>
12 </html>
13 <script src = "../../cookie.js"></script> //调用我们下面封装的cookie方法
14 <script>
15 // cookie做会话跟踪
16 // cookie特点:
17 // 1、大小限制(不能超过4k)
18 // 2、每个域下cookie不能超过50个
19 // 3、有效期(和设定时间有关),过了有效期cookie会自动删除
20 // 4、cookie读取(只能访问同一个域名下的cookie)(域的限制)
21 // 5、没有设置存储时间的cookie是临时cookie,浏览器关闭自动删除
22 // 6、cookie值只能是字符串
23 // 7、cookie访问:子能访问父的cookie 但是父不能访问子的cookie;
24
25 // 8、怎么写入带有时间的cookie 添加 expires=时间
26
27 // 9、怎么把cookie设置成当前域名下都能访问 path=/;一般我们都是设置到根目录;
28 // var d = new Date();
29 // //d.setDate(d.getDate() + 1);
30 // //document.cookie = 'age=20;path=/;expires=' + d;
31 // d.setSeconds(d.getSeconds() + 30);
32 // d.setHours(d.getHours() - 8 ); //小时减8或者 d = d.toGMTString();都行
33 // document.cookie = 'age=20;path=/;expires=' + d;
34 document.cookie = ''; // 写入一个cookie;
35 setCookie('xie1','6661',70); //利用封装好的插件设置一个cookie
36 console.log(getCookie('xie1')); //打印某一个cookie
37 removeCookie('xie1'); //删除某个cookie
38 document.cookie; //打印所有能读取的cookie
39 </script>
为此 ,我们封装了一个简单的(设置/获取/删除)cookie的方法,JS代码如下:
//添加一个cookie
function setCookie(cName,cVal,expires){
var d = new Date;
d.setDate(d.getDate() + expires);
document.cookie = cName + '=' + cVal + ';path=/;expires=' + d.toGMTString();
}; //时间.toGMTString()转成格林威治时间或是北京时间小时-8也行;
//获取cookie
function getCookie(cName){
//获取所有的cookie
var cookieStr = document.cookie;
//将所有的cookie转成数组
var cookieArr = cookieStr.split('; ');
//遍历数组
for(var i = cookieArr.length - 1;i >= 0 ;i--){
var smallArr = cookieArr[i].split('=');
if(smallArr[0] == cName){
return smallArr[1];
}
}
};
//删除cookie
function removeCookie(cName){
setCookie(cName,null,-1); //把该名字的cookie设置成过期时间
}