javscript对cookie的操作,以及封装

avscript对cookie的操作,以及封装

 
1
2
3
4
5
6
7
8
9
10
11
12
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
  用户名:<input type="text" name="user" id="user">
  年龄:<input type="text" name="age" id="age">
  <input type="button" name="" value="提交" id="btn">
</body>
</html>

  

JS代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<script type="text/javascript">
  // 设置cookie
  function setCookie(){
    // 获取当前时间
    var date = new Date();
     
    // 支持传一个json {name:value}
    var a = arguments;
    if(a.length==2){
      // 设置过期时间 = 当前时间 + 过期时间;
      date.setDate(date.getDate()+a[1]);
      for(k in a[0]){
        document.cookie = k +"="+ encodeURI(a[0][k]) +";expires=" + date.toGMTString()+";path=/";
      }
    }else{
      date.setDate(date.getDate()+a[2]);
      // 设置cookie = 值=value  encodeURI(把值进行编码) expires设置过期时间 path设置网站目录访问cookie权限,/表示当前域名下的所有目录都可以访问这个cookie
      document.cookie = a[0] +"="+ encodeURI(a[1]) +";expires=" + date.toGMTString()+";path=/";
    }
  }
  // 读取cookie
  function readCookie(name){
    // 获取cookie decodeURI把cookie进行解码
    var cookie = decodeURI(document.cookie);
    // 获取当前名称的起始索引
    var start = cookie.indexOf(name+'=');
    // 如果找不到这个名称的话就直接返回;
    if(start==-1)return '';
    // 获取结束索引,start表示开始查找的起点
    var end = cookie.indexOf(';',start);
    // 如果返回-1说明是最后一条数据
    if(end==-1){
      // 最后一条直接截取到末尾
      return cookie.substring(start+name.length+1);
    }
    // 如果不是末尾的话截取到;
    return cookie.substring(start+name.length+1,end);
  }
  // 删除cookie
  function removeCookie(name){
    document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/";
  }
 
  // 写入cookie
  var oBtn = document.getElementById('btn');
  oBtn.onclick = function(){
    var user = document.getElementById('user').value;
    var age = document.getElementById('age').value;
    // 设置cookie
    setCookie({
      'user':user,
      'age':age
    },10);
  };
 
  // 打印cookie
  console.log(readCookie('user'));
</script>

  

使用方法:

  设置cookie:setCookie()支持传递2个或3个参数 json&&time || nam&&value&&time              json:{name:value},time:多久过期

  读取cookie:readCookie(要读取的cookie名称)

  删除cookie:removeCookie(要删除的cookie

 
posted @ 2016-08-17 19:15  墨锦念  阅读(127)  评论(0)    收藏  举报