一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

javascript操作cookie函数两种简单的写法

时间:2014-07-18 编辑:简简单单 来源:一聚教程网

整理了两种简单的javascript操作cookie写法,均有三个功能:设置cookie、查询cookie、删除cookie。第一种简单易懂,第二种封装使用方便。原生js设置cookie。

首先设置cookie

每个cookie都是一个名/值对,可以把下面这样一个字符串赋值给document.cookie:
document.cookie="userId=125";
如果要一次存储多个名/值对,可以使用分号加空格(; )隔开,例如:
document.cookie="userId=828; userName=UFO";
在cookie的名或值中不能使用分号(;)、逗号(,)、等号(=)以及空格。在cookie的名中做
到这点很容易,但要保存的值是不确定的。如何来存储这些值呢?方法是用escape()函数进行编
码,它能将一些特殊符号使用十六进制表示,例如空格将会编码为“20%”,从而可以存储于
cookie值中,而且使用此种方案还可以避免中文乱码的出现。例如:
document.cookie="str="+escape("I love UFO");
相当于:
document.cookie="str=I%20love%20UFO";
当使用escape()编码后,在取出值以后需要使用unescape()进行解码才能得到原来的cookie值,
这在前面已经介绍过。
尽管document.cookie看上去就像一个属性,可以赋不同的值。但它和一般的属性不一样,改变
它的赋值并不意味着丢失原来的值,例如连续执行下面两条语句:
document.cookie="userId=125";
document.cookie="userName=UFO";
这时浏览器将维护两个cookie,分别是userId和userName,因此给document.cookie赋值更像执
行类似这样的语句:
document.addCookie("userId=125");
document.addCookie("userName=UFO");
事实上,浏览器就是按照这样的方式来设置cookie的,如果要改变一个cookie的值,只需重新赋
值,例如:
document.cookie="userId=451";
这样就将名为userId的cookie值设置为了451。
获取cookie的值

下面介绍几个cookies操作函数

简单版:

 代码如下 复制代码

function setCookie(name, value, iDay) {
    var oDate = new Date();
    oDate.setDate(oDate.getDate() + iDay);
    document.cookie = name+'='+value+';expires='+oDate+';path=/';
}
function getCookie(name) {
    var arr = document.cookie.split('; ');
    var i = 0;
    for(i=0; i         var arr2 = arr[i].split('=');
        if(arr2[0] == name) {return arr2[1];}
    }
    return '';
}
function removeCookie(name) {
    setCookie(name,'',-1);
}

封装版:

 代码如下 复制代码

var cookie=new function(){
    this.set=function(name,value,hours){
        var life=new Date().getTime();
        life+=hours*1000*60*60;
        var cookieStr=name+"="+escape(value)+";expires="+new Date(life).toGMTString()+";path=/";
        document.cookie=cookieStr;
    };
    this.get=function(name){
        var cookies = document.cookie.split("; ");
  var i = 0;
  for(i=0; i    var cookie2=cookies[i].split("=");
   if(cookie2[0]==name) {return unescape(cookie2[1]);}
  }
        return '';
    };
    this.remove=function(name){
        var cookieStr=name+"=''"+escape('null')+";expires="+new Date().toGMTString();
        document.cookie=cookieStr;
    };
}

热门栏目