JavaScript基础之Cookie

使用 JavaScript 创建Cookie

JavaScript 可以使用 document.cookie 属性来创建 、读取、及删除 cookies。

JavaScript 中，创建 cookie 如下所示：

document.cookie = 'username=hello world';

您还可以为 cookie 添加一个过期时间（以 UTC 或 GMT 时间）。默认情况下，cookie 在浏览器关闭时删除：

document.cookie="username=hello world; expires=Sat, 22 Oct 2016 13:18:19 GMT";

您可以使用 path 参数告诉浏览器 cookie 的路径。默认情况下，cookie 属于当前页面。

document.cookie="username=hello world; expires=Sat, 22 Oct 2016 13:18:19 GMT; path=/";

使用 JavaScript 读取 Cookie

在 JavaScript 中, 可以使用以下代码来读取 cookies：

var x = document.cookie;
//document.cookie 将以字符串的方式返回所有的 cookies.
//类型格式： cookie1=value; cookie2=value; cookie3=value;

使用 JavaScript 修改 Cookie

在 JavaScript 中，修改 cookies 类似于创建 cookies，如下所示：

document.cookie="username=welcome; expires=Sat, 22 Oct 2016 13:18:19 GMT; path=/";

旧的 cookie 将被覆盖。

使用 JavaScript 删除 Cookie

删除 cookie 非常简单。您只需要设置 expires 参数为以前的时间即可，如下所示，设置为 Thu, 01 Jan 1970 00:00:00 GMT:

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";

注意，当您删除时不必指定 cookie 的值。

Cookie 字符串

document.cookie 属性看起来像一个普通的文本字符串，其实它不是。

即使您在 document.cookie 中写入一个完整的 cookie 字符串, 当您重新读取该 cookie 信息时，cookie 信息是以名/值对的形式展示的。

如果您设置了新的 cookie，旧的 cookie 不会被覆盖。 新 cookie 将添加到 document.cookie 中，所以如果您重新读取document.cookie，您将获得如下所示的数据：

cookie1=value; cookie2=value;

如果您需要查找一个指定 cookie 值，您必须创建一个JavaScript 函数在 cookie 字符串中查找 cookie 值。

设置 cookie 值的函数

首先，我们创建一个函数用于存储访问者的名字：

/**
* 设置一个cookie
* @param  string  name  cookie名称
* @param  string  value cookie值
* @param  int     time  cookie有效期 单位秒
*/
function setcookie(name, value, time){
var d = new Date();
d.setTime(d.getTime() + time*1000);
var expires = 'expires=' + d.toUTCString();
document.cookie = name + '=' + value + '; ' + expires;
}

获取 cookie 值的函数

然后，我们创建一个函数用户返回指定 cookie 的值：

/**
* 获取一个cookie的值
* @param  string  name  cookie名称
* @return string        cookie值
*/
function getcookie(name){
name = name + '=';
var cookies = document.cookie.split(';');
for(var i = 0; i < cookies.length; i ++){
var ck = cookies[i].trim();
if(ck.indexOf(name) === 0){
return ck.substr(name.length, ck.length);
}
}
return '';
}