JavaScript如何获取和修改Cookie？

JavaScript 是一门用于网页开发的脚本语言，可以被用于在浏览器端处理动态网页中的交互效果。其中，Cookie 是它的一个重要组件之一。在本文中，我们将讨论如何使用 JavaScript 来获取和修改 Cookie，以及一些常见的 Cookie 操作。

一、什么是 Cookie？

Cookie是一种快速、有效的技术，用来存储客户端信息。Cookie 是服务器向客户端的浏览器发送的小文本文件，浏览器存储在用户的计算机上。每次客户端向服务器发送请求时，这个 Cookie 将会与请求一起被发送到服务器，这样服务器就可以使用 Cookie 中的信息来识别不同的客户端请求。

Cookie 的用途很多，比如：

1.记录用户的访问记录和喜好等，方便为用户提供更好的个性化服务；

2.实现购物车功能，存储用户购买的商品信息；

3.实现网站记住密码功能，用于用户登录信息的保存；

4.提供优惠券、广告等，通过 Cookie 进行跟踪用户行为；

5.实现多个子域名之间共享 Cookie，比如 https://www.example.com 和 https://blog.example.com。

二、JavaScript 中的 Cookie 操作

下面，我们来介绍一些 JavaScript 中的 Cookie 操作方法。我们将以获取和修改 Cookie 为例进行详细讲解。

1. 获取 Cookie

要获取 Cookie 的值，我们可以使用 document.cookie 属性来获取当前页面所有 Cookie 的值，并将它们存入一个数组中。

let cookies = document.cookie.split(‘;’);

for(let i = 0; i < cookies.length; i++) { let cookie = cookies[i]; while(cookie.charAt(0) === ' ') { cookie = cookie.substring(1); } if(cookie.indexOf(name) === 0) { return cookie.substring(name.length, cookie.length); }}上面的代码会返回一个格式为 "Name=Value" 的字符串数组并存入变量 cookies，我们可以使用 JavaScript 的字符串操作函数来获取其中的 Value。该代码的作用是循环遍历数组中的每一个 Cookie，去掉空白字符，并检查名字是否和所提供的参数匹配。如果名字匹配，则返回该 Cookie 的值。2. 修改 Cookie 要修改 Cookie 的值，我们需要使用 document.cookie 属性来设置新的 Cookie 值。document.cookie = "name=value";其中的 "name" 是要修改的 Cookie 名字，"value" 是新的 Cookie 值。如果要一次性修改多个 Cookie 值，可以使用多个 document.cookie 语句。另外，需要注意的是，修改 Cookie 的过程需要重新设置其相关属性，如路径、域等。例如，我们可以使用如下代码来修改 Cookie：document.cookie = "name=value;expires=Wed, 01 Jan 2020 00:00:00 UTC;path=/";上述代码中，我们将 name 值为 value 的 Cookie 值的过期日期设置为 2020 年 1 月 1 日，并将其路径设置为根目录。3.删除 Cookie要删除 Cookie，只需要将其过期日期设置为过去的时间即可。例如，我们可以使用如下代码来删除 Cookie：document.cookie = "name=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";删除 Cookie 的原理就是将它的 value 值设置为 ""，并将其过期时间设置为一个过去的日期。三、JavaScript 中的 Cookie 操作实例下面，我们来展示一些实例，以帮助大家更好地了解 JavaScript 中的 Cookie 操作。1. 创建 Cookie为了创建 Cookie，我们可以使用如下语句：document.cookie = "name=value";该语句将创建一个名为 "name" 的 Cookie，其相应的值为 "value"。2. 获取 Cookie为了获取 Cookie，我们可以使用如下语句：let cookie = getCookie("name");该语句将返回名为 "name" 的 Cookie 的值。3. 修改 Cookie为了修改 Cookie，我们可以使用如下语句：document.cookie = "name=newValue;expires=Wed, 01 Jan 2020 00:00:00 UTC;path=/";该语句将修改名为 "name" 的 Cookie 的过期日期和路径，并将值设置为 "newValue"。4. 删除 Cookie为了删除 Cookie，我们可以使用如下语句：deleteCookie("name");该语句将删除名为 "name" 的 Cookie。四、结论JavaScript 中的 Cookie 操作是 Web 开发中的一个重要组成部分。通过掌握相关的操作，我们可以实现 Cookie 的创建、获取、修改和删除等操作，来实现各种个性化的网页交互效果。