How do I set/unset a cookie with jQuery?

在使用 jQuery 来设置或取消设置 cookie 前，需要确保你已经引入了 jQuery 库和一个额外的 jQuery Cookie 插件，因为 jQuery 默认并不支持直接操作 cookie。可以在 jsDelivr 或者其他 CDN 上找到 jQuery Cookie 插件。

引入库

首先，在 HTML 文件中引入 jQuery 和 jQuery Cookie 插件：

html
<!-- 引入 jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- 引入 jQuery Cookie 插件 -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>

设置 Cookie

使用 jQuery Cookie 插件设置 cookie 非常简单。例如，如果你想为用户的登录状态设置一个 cookie，可以这样做：

javascript
// 设置 cookie
$.cookie('user', '张三', { expires: 7, path: '/' });

在这个例子中，'user' 是 cookie 的名称，'张三' 是存储的值，{ expires: 7, path: '/' } 是一个对象，指定了 cookie 的其他属性，比如过期时间（7天后过期）和路径（全站有效）。

读取 Cookie

读取已设置的 cookie 同样简单：

javascript
// 读取 cookie
var user = $.cookie('user');
console.log(user);  // 输出：张三

删除 Cookie

删除 cookie 时，只需调用 $.removeCookie() 函数，并传递要删除的 cookie 名称：

javascript
// 删除 cookie
$.removeCookie('user', { path: '/' });

这里 { path: '/' } 是必须的，因为在设置 cookie 时指定了路径，删除时也需要指定相同的路径。

示例：用户登录和登出

考虑一个实际的场景，用户登录时设置 cookie，登出时删除 cookie。

javascript
// 用户登录
function login(username) {
    $.cookie('user', username, { expires: 7, path: '/' });
    console.log(username + ' 已登录');
}

// 用户登出
function logout() {
    $.removeCookie('user', { path: '/' });
    console.log('用户已登出');
}

// 使用函数
login('张三');
logout();

以上就是如何在 jQuery 中通过 jQuery Cookie 插件来设置、读取和删除 cookie 的方法。这种方式在处理需要持久保存的用户偏好设置、登录状态等场景非常有用。