一、初识cookie写法
我们面对的是 cookie 的字符串，你自己编写这个字符串写入客户端，然后自己解析这个字符串。
var the_date = new Date("December 31, 2020");
var expiresDate = the_date.toGMTString();
document.cookie = "userDefineCSS=" + escape(title) + "; expires=" + expiresDate;
第一句是日期对象；
第二句将日期格式转换成 GMT 格式。 GMT： 即格林威治标准时间，现在也称 UTC 即全球标准时间。
第三句是将 cookie 内容写入客户端。其中 expires 是系统使用的，表示 cookie 的失效日期（也可以省略），expires 不可读。
escape 是对 cookie 值进行编码，这是为了处理中文、空格等而设立的。所以在返回 cookie 值时使用 unescape 进行解码。
二、cookie结构
我们这里所说的 cookie 结构并非其存储结构，而是其表现结构，主要通过研究其表现结构来实现 JS(JavaScript) 对 cookie 的操作。
cookie 的表现结构较为简单，每个 cookie 由 cookie 名称 和 cookie 值组成，用等号表示二者关系，各个 cookie 之间用分号加空格隔开。
正如前面所说 expires、path、domain 均不可读，所以在表现结构中也没有体现出来。
cookieName1=cookieValue1; cookieName2=cookieValue2[...; cookieNamen=cookieValuen]
通过分隔分号加空格符号，就可以获得各个 cookie，再通过分隔等号，就可以得出各个 cookie 的名称和值。cookie 的子键，只是表现在 cookieValue 上，一个子键的结构是：子键名称=子键值，多个子键之间用 & 连接起来。比如：
cookieName1=子键名称1=子键值1&子键名称2=子键值2
同名的 cookie，不同的 domain 或不同的 path，属不同的 cookie；
同名的 cookie，相同的 domain 且相同的 path，不同的 expires，属同一个 cookie。
cookie 有路径－－path，表示哪些路径下的文件有权限读取该 cookie。
path 应该以 "/" 结尾，同名 cookie，不同 path，属不同的 cookie
path 权限有继承性
假如指定了 /test/ 目录有权限读取某 cookie，那么 /test/ 之下的目录 /test/t/ 也有权限读取该 cookie。
三、示例代码
javascript操作cookie
//示例：进入页面次数
var cookiecount=hj_Example("cookie");
alert(cookiecount);
var hj_expDays = 1; //设置过期时间一天
var hj_exp = new Date();
hj_exp.setTime(hj_exp.getTime() + (hj_expDays*24*60*60*1000));
function hj_Example(cookieid){
var count = hj_GetCookie(cookieid)
if(count == null) { //没有值 第一次进入设置cookie
hj_SetCookie(cookieid,'1',hj_exp)
return 1
}
else{
var newcount = parseInt(count) + 1;
if(newcount<2) count=1;
//设置cookie新值
hj_SetCookie(cookieid,newcount,hj_exp);
return newcount
}
}
//循环查找cookie的值
function hj_GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg){
return hj_GetCookieVal(j);
}
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0){
break;
}
}
return null;
}
//设置cookie的值
function hj_SetCookie (name, value) {
var argv = hj_SetCookie.arguments; //获取所有参数
var argc = hj_SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null; //Cookie 过期日期和时间
var path = (argc > 3) ? argv[3] : null; //Cookie 要应用到的 URI 的路径部分
var domain = (argc > 4) ? argv[4] : null; //Cookie 对其有效的 URI
var secure = (argc > 5) ? argv[5] : false; //如果客户端仅在使用安全超文本传输协议 (HTTPS) 的后继请求中返回 Cookie，则为 true ；否则为 false 。默认为 false
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
//获取cookie的值
function hj_GetCookieVal(startstr) {
var endstr = document.cookie.indexOf (";", startstr);
//最后以为没有; 取总长度
if (endstr == -1){
endstr = document.cookie.length;
}
return unescape(document.cookie.substring(startstr,endstr));
}
//删除cookie
function hj_DeleteCookie (name) {
var hj_exp = new Date();
hj_exp.setTime (hj_exp.getTime() - 1);
var cval = 0; //将值设置为0
document.cookie = name + "=" + cval + "; expires=" + hj_exp.toGMTString();
}
</script>
HTML代码
<input id="a" type="button" value="写入cookie" onclick="hj_SetCookie('cookie','8')">
<input id="b" type="button" value="读取cookie" onclick="javascript:alert(hj_GetCookie('cookie'))">
<input id="c" type="button" value="清除cookie" onclick="hj_DeleteCookie('cookie')">
</body>