JavaScript Cookie 操作类封装与使用详解
作者:函数茶馆时间:2026-10-29 07:52:25浏览:370
本文介绍一个轻量级的 JavaScript Cookie 操作类,提供 SetCookie、GetCookie 和 Expire 三个核心方法。支持设置普通键值、指定过期时间、自定义域名与路径,以及存储带子键的复合数据。通过示例展示如何封装字符串处理与 DOM 操作,实现便捷的 Cookie 读写与删除功能。
JavaScript Cookie 操作类封装与使用详解
本文分享一个用于处理 Cookie 的 JavaScript 类库,旨在为开发者提供一套简洁易用的解决方案。
该类的具体使用方式如下:
首先,介绍如何向 Cookie 中写入数据。
var cookie = new JSCookie();
// 普通设置
cookie .SetCookie("key1","val1");
// 过期时间为一年
var expire_time = new Date();
expire_time.setFullYear(expire_time.getFullYear() + 1);
cookie .SetCookie("key2","val2",expire_time);
// 设置域及路径,带过期时间
cookie .SetCookie("key3","val3",expire_time,".cnblogs.com","/");
// 设置带子键的cookie,子键分别是k1,k2,k3
cookie .SetCookie("key4","k1=1&k2=2&k3=3");
其次,演示如何从 Cookie 中读取已保存的数据。
// 简单获取
cookie .GetCookie("key1");
cookie .GetCookie("key2");
cookie .GetCookie("key3");
cookie .GetCookie("key4");
// 获取key4的子键k1值
cookie .GetChild("key4","k1");
最后,讲解如何使特定的 Cookie 失效。
cookie .Expire("key1");
cookie .Expire("key2");
cookie .Expire("key3");
cookie .Expire("key4");
以下是具体的代码示例:
<script type="text/javascript">
String.prototype.Trim = function()
{
return this.replace(/^\s+/g,"").replace(/\s+$/g,"");
}
function JSCookie()
{
this.GetCookie = function(key)
{
var cookie = document.cookie;
var cookieArray = cookie.split(';');
var getvalue = "";
for(var i = 0;i<cookieArray.length;i++)
{
if(cookieArray[i].Trim().substr(0,key.length) == key)
{
getvalue = cookieArray[i].Trim().substr(key.length + 1);
break;
}
}
return getvalue;
};
this.GetChild = function(cookiekey,childkey)
{
var child = this.GetCookie(cookiekey);
var childs = child.split('&');
var getvalue = "";
for(var i = 0;i < childs.length;i++)
{
if(childs[i].Trim().substr(0,childkey.length) == childkey)
{
getvalue = childs[i].Trim().substr(childkey.length + 1);
break;
}
}
return getvalue;
};
this.SetCookie = function(key,value,expire,domain,path)
{
var cookie = "";
if(key != null && value != null)
cookie += key + "=" + value + ";";
if(expire != null)
cookie += "expires=" + expire.toGMTString() + ";";
if(domain != null)
cookie += "domain=" + domain + ";";
if(path != null)
cookie += "path=" + path + ";";
document.cookie = cookie;
};
this.Expire = function(key)
{
expire_time = new Date();
expire_time.setFullYear(expire_time.getFullYear() - 1);
var cookie = " " + key + "=e;expires=" + expire_time + ";"
document.cookie = cookie;
}
}
</script>
以上就是该 Cookie 操作类的完整实现与用法。
希望这段代码能帮助读者更好地掌握 JavaScript 中 Cookie 的管理技巧。
作者最新文章
JS大数值转字符串出现科学计数法怎么办
2026-11-05 17:09:21
JS split切割后出现空字符串怎么过滤
2026-11-05 16:00:30
在 React 或 Vue 项目中封装使用 JS 节流防抖
2026-11-05 15:27:29
JavaScript中怎么将带小数的字符串转为整数?
2026-11-05 14:32:38
怎么用JavaScript策略模式重构电商促销计算逻辑?
2026-11-05 14:01:09
