js添加查询删除cookie操作代码

这一技客 2009-11-04 13:34:49 累计浏览 3,238 次

本机暂存

内容概览

这篇讲的是前端开发中处理 Cookie 的实用技巧。作者直接提供了一套简洁的 JavaScript 工具函数，用于实现 Cookie 的添加、查询和删除操作。

文章没有长篇大论，而是通过一个清晰的代码表格，展示了 `setCookie`、`getCookie` 和 `deleteCookie` 这三个核心函数的实现。例如，添加 Cookie 时如何处理有效期（expires）和路径（path）参数，查询时如何利用 `document.cookie` 字符串解析键值对，删除时又如何巧妙地将过期时间设为过去。代码封装得很干净，将原本繁琐的字符串拼接与解析逻辑，变成了开发者可以直接调用的、接口友好的函数。

对于前端开发者来说，这套代码提供了一个即拿即用的解决方案。尤其是在需要轻量级状态管理或用户偏好记忆的场景下，能省去很多重复造轮子的时间。它把浏览器原生 Cookie API 的细节都处理妥当，让日常开发更省心。

以下是代码片段：
function addCookie(objName,objValue,objHours) {
  var str = objName + "=" + escape(objValue);
  if(objHours > 0){
    var date = new Date();
    var ms = objHours*3600*1000;
    date.setTime(date.getTime() + ms);
    str += "; expires=" + date.toGMTString();
  }
  document.cookie = str;
}
function getCookie(objName) {
  var arrStr = document.cookie.split("; ");
  for(var i = 0;i < arrStr.length;i ++){
    var temp = arrStr[i].split("=");
    if(temp[0] == objName) return unescape(temp[1]);
  }
}
function delCookie(name) {
  var date = new Date();
  date.setTime(date.getTime() - 10000);
  document.cookie = name + "=a; expires=" + date.toGMTString();
}

同分类推荐文章

translateZ() （2026-06-25 21:18:56）
translateY() （2026-06-25 21:17:56）
translateX() （2026-06-25 21:16:01）

查看更多前端文章 →

建议继续学习

JQuery实现Excel表格呈现（累计阅读 48,337）
程序员技术练级攻略（累计阅读 35,425）
深入理解Javascript之执行上下文(Execution Context) （累计阅读 18,387）
从输入 URL 到页面加载完成的过程中都发生了什么事情？（累计阅读 15,915）
图片动态局部毛玻璃模糊效果的实现（累计阅读 14,835）
天朝第二代身份证号码的验证机制（累计阅读 14,749）
HTML 5 的data-* 自定义属性（累计阅读 14,334）
分享一个JQUERY颜色选择插件（累计阅读 14,213）
什么是全栈工程师？（累计阅读 14,023）
快速排序（Quicksort）的Javascript实现（累计阅读 11,719）