关键词

设置和读取cookie的javascript代码

下面我将为您讲解设置和读取cookie的JavaScript代码完整攻略。

设置Cookie

要设置Cookie,我们可以使用document.cookie属性。该属性包含所有当前页面的Cookie。我们可以通过向document.cookie添加字符串来添加Cookie。

以下是添加单个Cookie的代码:

// 设置一个名为 username 的 cookie,过期时间是24小时
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2022 12:00:00 UTC; path=/";

在这个例子中,我们设置了名为 "username" 的Cookie,并将其值设置为 "John Doe"。该Cookie将在2022年12月18日12:00:00 GMT之前过期。

此外,我们还使用了path属性,该属性指定了这个Cookie所属的页面路径。如果没有指定路径,默认路径是当前路径。

我们也可以在同一页面中设置多个Cookie:

document.cookie = "username=John Doe; expires=Thu, 18 Dec 2022 12:00:00 UTC; path=/";
document.cookie = "email=johndoe@gmail.com; expires=Thu, 18 Dec 2022 12:00:00 UTC; path=/";

读取Cookie

要读取Cookie,我们可以使用document.cookie属性。此属性将返回所有当前页面的Cookie。我们可以使用正则表达式或split()函数将Cookie字符串转换为对象。

以下是读取单个Cookie的代码:

// 读取名为 username 的cookie
const cookieValue = document.cookie.replace(/(?:(?:^|.*;\s*)username\s*\=\s*([^;]*).*$)|^.*$/, "$1");

在这个例子中,我们使用正则表达式从document.cookie字符串中获取名为 "username" 的Cookie值。我们将其存储在变量 cookieValue 中。

如果我们想要读取所有Cookie的值,可以使用以下代码:

// 获取所有Cookie的名称和值
const cookies = document.cookie.split(';').map(cookie => cookie.split('=')).reduce((accumulator, [key, value]) => ({ ...accumulator, [key.trim()]: value }), {});

在这个例子中,我们首先使用split()函数将document.cookie字符串转换为一个数组,该数组包含每个Cookie的名称和值。然后,我们使用map()函数将每个Cookie的名称和值转换为一个数组。接下来,我们使用reduce()函数将这些数组转换为一个对象,该对象包含每个Cookie的名称和值。最后,我们将这个对象存储在变量cookies中。

总之,设置和读取Cookie都是非常简单的操作,只需要使用document.cookie属性即可。同时,我们也可以使用正则表达式或split()函数将Cookie字符串转换为对象,以方便读取Cookie的值。

本文链接:http://task.lmcjl.com/news/10508.html

展开阅读全文