您的位置：首页 > Web前端 > JavaScript

JavaScript中cookie的使用

2012-11-19 19:41 218 查看

通过JavaScript的网页客户端编程，可以使用cookie对数据进行存储。相对于JavaScript中用于存储数据的变量来说，生命期更长，JavaScript的变量会在当前网页关闭时销毁所有的数据，而存储在cookie中的数据即使网页关闭了也会保留某些你需要的数据（比如用户名，邮箱帐号等等），以便下次打开网页时继续使用；对于那些需要长期保存又不必要存储在网络服务器上的数据，使用cookie保存是一种不错的选择。

下面是封装好的进行cookie操作的JavaScript代码：

//向cookie写入数据
function writeCookie(name, value, days) {
// 定义有效日期（cookie的有效时间）
var expires = "";

// 为有效日期赋值
if (days) {
var date = new Date();
//设置有效期（当前时间+时间段）
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));//时间段为毫秒数
expires = "; expires=" + date.toGMTString();
}

// 给cookie赋值 name, value和expiration date（有效期）
document.cookie = name + "=" + value + expires + "; path=/";
}
//读取cookie数据
function readCookie(name) {
var searchName = name + "=";
var cookies = document.cookie.split(';');
for(var i=0; i < cookies.length; i++) {
var c = cookies[i];
while (c.charAt(0) == ' ')
c = c.substring(1, c.length);
if (c.indexOf(searchName) == 0)
return c.substring(searchName.length, c.length);
}
return null;
}
//清楚所有的cookie
function eraseCookie(name) {
// 将时间设置成-1将清除存储在cookie中的数据
writeCookie(name, "", -1);
}

将其复制在记事本里，改名为cookie.js。

接下来我们再打开一个记事本写入如下html代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">
<script type="text/javascript" src="cookie.js"></script>
<script type="text/javascript">
var userName
function button_click()
{
userName=readCookie("username");
if(userName){
alert("Hello "+userName+",I miss you")
}
else{
var userName=prompt("What is your name","Enter you name here")
writeCookie("username",userName,5);
}
}
</script>
</head>
<body>
<input type="button" value="Click me" onclick="button_click();" />

</body>
</html>

保存成test.html文件，拖放到浏览器运行，对cookie的简单测试就完成了，当你多次单击按钮，或者关闭浏览器再打开，浏览器都能记住你的名字。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航