javascript设置cookie的简单方法

品味人生 • 发布于 2019-02-01 21:37:02

这个家伙很害羞,不想介绍自己!

一般情况下,为了记录用户的访问设置与用户操作记录,可以通过设置cookie的方法记录用户对页面的参数设置。当用户下次访问网站时,可以通过读取cookie来还原上一次用户的页面设置。

设置cookie的方法有很多种;比如通过服务器脚本页面进行设置,诸如aps,php等程序脚本。但有时候我们需要在静态页面上设置cookie,这时候我们就需要用到javascipt方法了。

设置cookie

每个cookie都是一对值,例如这样:document.cookie="user=391";

如果cookie中包含多个值,则需要使用“;”隔开,例如这样:document.cookie="user=391; set=11";

需要注意的是 cookie的名称或值不能使用分号(;),逗号(,),等号(=)以及空格符。但是多数情况下我们储存的值是不确定的,那我们如何储存这些值呢?

解决办法是使用escape()函数进行编码,它能将特殊符号使用十六进制表示;例如空格字符将会编码为“%20”,从而可以存储于cookie值中。使用此种方案还可以避免中文乱码的出现。

escape函数使用示例:

document.cookie="json="+escape("My name is philip");

被编译为十六进制的值会转变为如下形态:
document.cookie="json="+escape("My%20name%20is%20philip");

通过escape函数编译过的cookie值,如果在取值的时候需要使用unescape函数进行解码才能得到原来的cookie值,这点需要注意。

document.cookie看上去就像一个属性,可以赋不同的值。但它和一般的属性不一样,改变它的赋值并不意味着丢失原来的值。如果要改变一个cookie的值,只需重新赋值即可。

获取cookie值
cookie的值可以使用document.cookie直接获得:var strCookie=document.cookie; 这将获得这些名/值对包括了该域名下的所有cookie。例如:




上面的实例中,一次只能获取所有的cookie值,无法通过指定cookie名称获得对应的值,其实这也是处理cookie比较麻烦的地方。我们需要分析字符串来获取我们需要的cookie值,例如:



通过这种方法,就可以获得单个的cookie值;而且使用类似的方法可以获得多个cookie值,主要就是通过调用输出数组,获取不同的cookie值。

给cookie设置过期时间

到目前为止,所有的cookie都是单会话cookie,即浏览器关闭后这些cookie将会丢失,事实上这些cookie仅仅是存储在内存中,而没有建立相应的硬盘文件。

在实际开发中,cookie常常需要长期保存,例如保存用户登录的状态。这可以用下面的选项来实现:


document.cookie="user=828; expiress=GMT_String";

其中GMT_String是以GMT格式表示的时间字符串,这条语句就是将user这个cookie设置为GMT_String表示的过期时间,超过这个时间,cookie将消失,不可访问。例如:如果要将cookie设置为10天后过期,可以这样实现:



删除cookie
如果需要删除cookie的话,直接将过期时间设置成一个已经过去的日期即可。例如:



简单的javascript设置cookie的方法就介绍到这里,通过上面的方法,我们已经可以满足基本的cookie应用和需求了。
关于更复杂的cookie设置方法,以后会在博文里另行说明。