HTML5/CSS3跨平台开发技术分享（三）

最新推荐文章于 2024-08-22 14:32:34 发布

Alan_Wdd

最新推荐文章于 2024-08-22 14:32:34 发布

阅读量1k

点赞数

分类专栏：技术指南文章标签： cookie javascript jquery css3

技术指南专栏收录该内容

53 篇文章 0 订阅

订阅专栏

js操作cookie存取数据实例与分析（三）

接上篇文章接着写，上次讲到存取数据，现在主要介绍删除cookie的操作。

前面说到的cookie设置，在你关闭浏览器之后，就会自动清掉了，实际上那些cookie设置是保存在内存中的，如果这样就能满足用户需求，那我们通常是不用cookie的。直接保存了一个变量里就好了。

为了让用户下次打开浏览器还能看到之前的cookie，我们需要把cookie保存在硬盘上。这时候我们需要设置一个属性，过期时间。

document.cookie="userName=lzl; expires=GMT_String";

其中GMT_String是以GMT格式表示的时间字符串，这条语句就是将userName这个cookie设置为GMT_String表示的过期时间，超过这个时间，cookie将消失，不可访问。

比如设置一个cookie，7天内可访问。代码如下

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>cookie test</title>
<meta name="keywords" content="">
<meta name="description" content="">
<script>
function setCookie() {

}
function showCookie() {
if (document.cookie)
{

alert(document.cookie)
}
else{alert("document.cookie 不存在");}
}
</script>
</head>

<body>
<input type="button" οnclick="setCookie()" value="设置cookie"/>
<input type="button" οnclick="showCookie()"value="显示cookie"/>
</body>
</html>

上面的代码，在设置cookie后7天之内，点击显示cookie，都能弹出之前设置的值。

删除已经存在的cookie也是利用了时间，不过把过期时间设置为过去的某一个时间，cookie就会自动清掉相应的设置了。代码如下

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>cookie test</title>
<meta name="keywords" content="">
<meta name="description" content="">
<script>
function setCookie() {

}
function delCookie() {
var date = new Date();
date.setTime(date.getTime()-10000);
//设置过期时间为已经过去的时间点
document.cookie = "userName=lzl; expires=" + date.toGMTString();
}

function showCookie() {
if (document.cookie)
{

alert(document.cookie)
}
else{alert("document.cookie 不存在");}
}
</script>
</head>

<body>
<input type="button" οnclick="setCookie()" value="设置cookie"/>
<input type="button" οnclick="delCookie()" value="删除cookie"/>
<input type="button" οnclick="showCookie()"value="显示cookie"/>
</body>
</html>

关于cookie的读写操作就介绍到这里了。欢迎交流~

摘自：http://hi.baidu.com/kuntakinte/item/08d2fb3297ba40c32e8ec219

Alan_Wdd

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5/CSS3跨平台开发技术分享（三）

js操作cookie存取数据实例与分析（三）接上篇文章接着写，上次讲到存取数据，现在主要介绍删除cookie的操作。前面说到的cookie设置，在你关闭浏览器之后，就会自动清掉了，实际上那些cookie设置是保存在内存中的，如果这样就能满足用户需求，那我们通常是不用cookie的。直接保存了一个变量里就好了。为了让用户下次打开浏览器还能看到之前的cookie，我们需
复制链接

扫一扫

专栏目录