jQuery Cookie

Cookie 是保存在浏览器端的小段键值对文本，常用于"记住登录状态、用户偏好"等需求。原生 document.cookie 读写繁琐，还要自己拼串、算过期时间；jQuery Cookie 插件把它封装成一行代码的 $.cookie() 方法，让 Cookie 操作像读写变量一样简单。

1. 引入插件

插件基于 jQuery，可下载 jquery.cookie.js 或直接引用 CDN：

<script src="https://example.com/jquery.min.js"></script>

说明：示例中的 https://example.com 地址为占位域名，实际使用请替换为官方 CDN 或本地文件路径。
<script src="https://example.com/jquery.cookie.min.js"></script>

2. 写入 Cookie

$.cookie(名称, 值, 选项)：

$.cookie("username", "example", { expires: 7, path: "/" });
// 效果：写入 username=example 的 Cookie，7 天后过期，全站路径生效

3. 读取与删除

读取用 $.cookie(名称)，删除用 $.removeCookie(名称, 选项)：

var name = $.cookie("username");   // 不存在时返回 null
console.log(name);                 // 输出：example

$.removeCookie("username", { path: "/" });   // 删除成功返回 true
// 效果：开发者工具 Application→Cookies 中该记录被清除

4. 常用选项

选项	说明
expires	过期天数（数字）或 Date 对象；不写则关闭浏览器即失效
path	生效路径，默认当前路径，全站用 "/"
domain	生效域名，跨子域共享时设置
secure	true 时仅在 HTTPS 下传输

注意：删除 Cookie 时必须与写入时使用相同的 path/domain，否则删不掉。

5. 实战：记住用户名

$("#login").submit(function () {
  if ($("#remember").prop("checked")) {
    $.cookie("username", $("#user").val(), { expires: 30, path: "/" });
  }
  return true;
});

// 页面加载时回填：
var saved = $.cookie("username");
if (saved) { $("#user").val(saved); }
// 效果：勾选"记住我"登录后，30 天内再次打开页面自动回填用户名

6. 使用边界

• Cookie 体积上限约 4KB，且明文保存在客户端，不能存放密码等敏感信息；
• 每次 HTTP 请求都会自动携带 Cookie，适合做登录态，但别用它存大数据；
• 纯前端偏好数据可考虑 localStorage，不过 Cookie 仍是服务端会话的主流载体。

小结

$.cookie() 一行完成 Cookie 的读、写、删，配合 expires/path 即可实现"记住我"等经典需求；牢记删除需与写入同 path、容量小且明文，敏感数据交给服务端处理。