JS设置获取cookies的方法

当我们需要在网站或应用程序中储存数据时，Cookies 是一种常见的解决方案。通过在浏览器中创建 Cookies，我们可以方便地存储用户信息、在线购物车、偏好设置等等内容。在 JavaScript 中，设置和获取 Cookies 非常简单，下面是介绍如何设置和获取

当我们需要在网站或应用程序中储存数据时，Cookies 是一种常见的解决方案。通过在浏览器中创建 Cookies，我们可以方便地存储用户信息、在线购物车、偏好设置等等内容。在 JavaScript 中，设置和获取 Cookies 非常简单，下面是介绍如何设置和获取 Cookies 的攻略：

设置 Cookies

使用 JavaScript 设置 Cookies 非常简单。我们可以使用 document.cookie 属性设置 Cookies。下面是创建一个名为 username 的 Cookies 的代码示例：

document.cookie = "username=John Doe";

上面的代码创建了一个名为 username 的 Cookies，并将其值设置为 John Doe。如果您现在在浏览器中打开控制台并输入 document.cookie，则会看到类似于以下内容的输出：

"username=John%20Doe"

获取 Cookies

要获取 Cookies 的值，我们可以直接使用 document.cookie 属性。下面是获取名为 username 的 Cookies 的代码示例：

let cookies = document.cookie.split("; ");
for (let i = 0; i < cookies.length; i++) {
  let cookie = cookies[i].split("=");
  if (cookie[0] === "username") {
    let username = decodeURIComponent(cookie[1]);
    console.log(username);
  }
}

上面的代码首先将所有 Cookies 拆分成一个数组，每个 Cookies 都是一个字符串。然后我们遍历该数组以找到名为 username 的 Cookies。一旦找到了 username Cookies，我们就使用 decodeURIComponent() 函数将其值解码并输出到控制台。

示例

下面是一个设置和获取 Cookies 的完整示例。该示例创建了名为 username 和 email 的 Cookies，并在控制台中输出它们的值：

// 设置 Cookies
document.cookie = "username=John Doe";
document.cookie = "email=johndoe@example.com";

// 获取 Cookies
let cookies = document.cookie.split("; ");
for (let i = 0; i < cookies.length; i++) {
  let cookie = cookies[i].split("=");
  switch(cookie[0]) { 
    case "username":
      let username = decodeURIComponent(cookie[1]);
      console.log("Username: " + username);
      break;
    case "email":
      let email = decodeURIComponent(cookie[1]);
      console.log("Email: " + email);
      break;
  }
}

运行上述代码后，将在控制台中看到类似于以下内容的输出：

Username: John Doe
Email: johndoe@example.com