`document.cookie` 是 JavaScript 中用于访问和操作浏览器中的 cookie 的属性。通过它，你可以读取、创建和修改浏览器中的 cookie。每个 cookie 通常包含一些信息，如名称、值、有效期等。这些 cookie 可以帮助网站记住用户的偏好或其他信息，并在用户下次访问时提供个性化的体验。
使用 `document.cookie` 可以执行以下操作：
### 读取 Cookie
可以通过直接访问 `document.cookie` 属性来读取所有的 cookie 信息，但通常会以字符串的形式返回所有 cookie 的集合，这会使得解析和读取特定 cookie 相对困难。为了更方便地读取单个 cookie，可以使用以下代码片段：
```javascript
function getCookie(name) {
const value = "; " + document.cookie;
const parts = value.split("; ");
for (let i = 0; i < parts.length; i++) {
const cookiePair = parts[i].split("=");
if (cookiePair[0] === name) {
return cookiePair[1]; // 返回找到的 cookie 的值
}
}
return ""; // 如果未找到则返回空字符串
}
```
### 创建和修改 Cookie
通过修改 `document.cookie` 属性可以创建新的 cookie 或修改现有的 cookie。例如：
```javascript
document.cookie = "username=JohnDoe; expires=Thu, 18 Dec 2023 12:00:00 UTC; path=/";
```
上述代码会创建一个名为 "username" 的 cookie，值为 "JohnDoe"，设置了过期时间和路径。如果已存在名为 "username" 的 cookie，该操作将更新该 cookie 的值或属性。
### 删除 Cookie
要删除一个 cookie，可以设置其过期日期为一个过去的时间点。例如：
```javascript
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/";
```
这将使名为 "username" 的 cookie 过期并失效，从而将其从浏览器中删除。但请注意，如果浏览器已经缓存了该 cookie（例如在用户已经访问过该网站后），可能仍会保留一些旧版本的数据，直到下次网站再次设置新的 cookie 或浏览器缓存过期。所以完全清除用户的本地存储可能并不总是完全有效或即时的。在实际使用中需要谨慎处理这类问题。