天天看点

Javascript如何操作(创建/读取/删除)cookie

曲奇(小甜点),来源于英语cookie。

cookie这个词想必很多做前段的朋友都接触过,但是没有详细的了解以及操作过。如何的确如此,那么就停下来了解一下如何通过js来操作cookie值吧!

通过本文你将粗略的明白cookie是什么,如何通过js创建/存储以及获取cookie,如何让cookie过期来删除cookie...

cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 javascript 来创建和取回 cookie 的值。 来自的解释 某些 web 站点在您的硬盘上用很小的文本文件存储了一些信息,这些文件就称为 cookie。 msie的帮助信息

不同的浏览器针对cookie操作的方式不一样(比如ie是生成一个文本)。通俗一点的说,cookie就是比html高级一点的程序创建的,保存在客户端(就是你的电脑)来记录用户的一些信息的东西。

每个cookie的结构都是这样的 cookie的名字=cookie的值

cookie的名字与值的命名方面同js的命名规则差不多,只不过多了“只能用可以用在url编码中的字符”,即如果保存汉字的话,需要用escape()编码,然后读取的时候用unescape()解码;

每个cookie都有过期时间,当电脑的时间过了给定的过期时间,这个cookie就会失效。js无法直接删除cookie值,但是可以通过设置失效日期来让此cookie无法工作。

创建cookie的方法,用到的是documents.cookie属性;给cookie赋值的方法如下:

documents.cookie = ‘cookiename=‘ + escape(‘cookievalue‘)+ ‘;expires=‘ + expirationdateobj.togmtstring();

看到这些是否有些麻木呢?其实说明一下很简单,cookiename是你的cookie的名字,比如“niumowang_cookie”;cookievalue是你的cookie的值,比如“牛魔王的世界观”;expirationdateobj

是保存过期时间的对象名,togmtstring()是将时间设置成gmt(格林尼治时间),cookie只支持此时间格式。如果这里不设置时间的话,默认是浏览器关闭窗口cookie过期。

ok,我们来看一个保存用户名字的cookie示例,我们设置一个 “name”=“pizi”的cookie,并在2个月过期

function setcookie(){ var expires = new date(); expires.settime(expires.gettime() + 2 * 30 * 24 * 60 * 60 * 1000); /* 2个月 x  30 天 x  24 小时 x  60 分 x 60 秒 x  1000 毫秒 */ documents.cookie = ‘name=pizi;expires=‘ + expires.togmtstring(); }

上面的pizi没有用escape编码是因为,escape编码后的结果就是escape

function delcookie (nameofcookie) { // 检查cookie是否设置,如果设置了则将过期时间调到过去的时间; //thu, 01-jan-70 00:00:01 gmt,该时间为1970年1月1号 if (getcookie(nameofcookie)) { document.cookie = nameofcookie + "=" + "; expires=thu, 01-jan-70 00:00:01 gmt";

上面函数检测是否设置了名字为

nameofcookie的cookie,如果设置的话将该cookie的失效日期调到1970年1月1号,这样该cookie就会失效,剩下的就是浏览器处理过期cookie的机制了。关于该时间,可以参考:

w3school有一些关于js操作cookie的教程,并附带一个欢迎cookie的示例,有兴趣的朋友去看下,地址:

下面是js操作cookie的示例演示:运行代码会提示输入用户名,然后关闭打开的窗口再运行一次代码会看到效果。或者另存为html文件查看演示

<html>

<head>

<script

type="text/javascript">

function getcookie(c_name)

if

(document.cookie.length>0)

c_start=document.cookie.indexof(c_name

+ "=")

if (c_start!=-1)

c_start=c_start +

c_name.length+1

c_end=document.cookie.indexof(";",c_start)

(c_end==-1) c_end=document.cookie.length

return

unescape(document.cookie.substring(c_start,c_end))

""

function setcookie(c_name,value,expiredays)

var exdate=new

date()

exdate.setdate(exdate.getdate()+expiredays)

document.cookie=c_name+

"=" +escape(value)+

((expiredays==null) ? "" :

";expires="+exdate.togmtstring())

function checkcookie()

username=getcookie(‘username‘)

(username!=null && username!="")

{alert(‘welcome again

‘+username+‘!‘)}

else

username=prompt(‘please enter your

name:‘,"")

if (username!=null && username!="")

setcookie(‘username‘,username,365)

</script>

</head>

<body onload="checkcookie()">

</body>

</html>