javascript js cookie的存储,获取和删除

JavaScript Cookie是一种客户端存储技术,允许网站存储少量信息在客户端的浏览器中。以下是JavaScript Cookie的存储、获取和删除的详细攻略:

存储

为了存储Cookie,需要使用document.cookie属性。这个属性允许我们在客户端创建、读取和删除Cookie。以下代码展示了如何创建一个Cookie:

document.cookie = "name=value; expires=date; path=path; domain=domain; secure";
  • name=value:Cookie的名称和值
  • expires:Cookie的过期时间,以GMT格式表示。如果未设置过期时间,Cookie将在浏览器关闭时删除
  • path:Cookie可用的路径,默认为当前网页路径
  • domain:Cookie可用的域名,默认为当前域名
  • secure:如果设置为true,则只有在安全连接(HTTPS)上才能发送Cookie

以下是使用JavaScript创建一个名为username,值为John的Cookie的示例代码:

document.cookie = "username=John; path=/";

获取

为了获取Cookie的值,需要读取document.cookie属性,并解析字符串来找到我们需要的Cookie值。以下是使用正则表达式来获取名为username的Cookie的值的示例:

function getCookie(name) {
  let cookieArr = document.cookie.match(`(^|;) ?${name}=([^;]*)(;|$)`);
  return cookieArr ? cookieArr[2] : null;
}
let username = getCookie("username");
console.log(username); // "John"

该函数使用了正则表达式匹配寻找Cookie名称为name的Cookie,并返回该Cookie的值。如果找不到该Cookie,则返回null。

删除

为了删除Cookie,只需要设置该Cookie已过期即可。以下是使用JavaScript删除名为username的Cookie的示例:

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/";

该代码将过期日期设置为1970年1月1日,使该Cookie在客户端过期,从而删除了该Cookie。

综上,以上是JavaScript Cookie的存储、获取和删除完整攻略。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:javascript js cookie的存储,获取和删除 - Python技术站

(0)
上一篇 2023年6月11日
下一篇 2023年6月11日

相关文章

  • 简单封装js的dom查询实例代码

    下面开始讲解“简单封装js的dom查询实例代码”的攻略。 1. 理解DOM及其相关API 在开始封装DOM查询代码之前,首先需要对DOM及其相关API有一定的了解。请参考以下内容: 1.1 DOM是什么? DOM是文档对象模型(Document Object Model)的缩写,是一种用于访问和操作HTML和XML文档的编程接口。DOM将文档作为由节点(包括…

    JavaScript 2023年6月10日
    00
  • JavaScript数据存储 Cookie篇

    下面是JavaScript数据存储之Cookie篇的完整攻略。 什么是Cookie Cookie 是一种在客户端存储数据的机制,通过浏览器将数据存储在用户的计算机上。Cookie 通常由 Web 服务器生成,以便服务器可以记住用户的状态,从而改善用户对网站的体验。 Cookie 的属性 Cookie 有以下几个属性: 名称:Cookie 的名称。 值:Coo…

    JavaScript 2023年6月11日
    00
  • Js放到HTML文件中的哪个位置有什么区别

    JavaScript 代码可以放在 HTML 文档的不同位置,包括 <head> 标签中和 <body> 标签中。 把 JavaScript 放在标签中 首先,将JavaScript代码放在 标签中,可以使 JavaScript 代码在页面加载之前被加载。考虑到现代web应用程序的性能和用户体验,有效地加载 JavaScript 对于…

    JavaScript 2023年5月27日
    00
  • js cookie实现记住密码功能

    下面是关于“js cookie实现记住密码功能”的完整攻略。 什么是cookie Cookie 是一种小的文本数据,它通常由一个网站的服务器发送到网站的浏览器之后就被存储在浏览器的本地硬盘上。每当该浏览器向同一网站再次发出请求时,它就会将这些 Cookie 信息发送给该网站的服务器。 如何使用js cookie实现记住密码功能 一般情况下,我们可以通过设置一…

    JavaScript 2023年6月11日
    00
  • event.srcElement 用法笔记e.target

    event.srcElement 和 e.target 都是指向事件触发的DOM元素的属性。在不同的浏览器中,其名称和行为可能略有不同,但作用是一样的。 在现代浏览器中,我们应该用 e.target 代替 event.srcElement。下面是两个例子,演示了如何使用这两个属性: 使用 event.srcElement document.addEventL…

    JavaScript 2023年6月10日
    00
  • JavaScript forEach()遍历函数使用及介绍

    JavaScript forEach()遍历函数使用及介绍 什么是forEach()函数 forEach()是JavaScript中的一个数组遍历方法。它允许您迭代数组中的每个项,并对它们执行一个回调函数。 forEach()函数的语法 forEach()函数的语法如下: array.forEach((value, index, array) => {…

    JavaScript 2023年5月27日
    00
  • AngularJS验证信息框架的封装插件用法【w5cValidator扩展插件】

    让我来详细讲解一下“AngularJS验证信息框架的封装插件用法【w5cValidator扩展插件】”的完整攻略。 什么是w5cValidator? w5cValidator是一个简单易用的AngularJS表单验证框架,可以通过自定义指令来验证表单元素的合法性,并且支持内置的一些常用验证规则。 如何使用w5cValidator? 步骤一:引入w5cVali…

    JavaScript 2023年6月10日
    00
  • 解决vue中使用history.replaceState 更改url vue router 无法感知的问题

    在Vue Router中,要想改变URL但不重新加载页面,可以使用history.pushState()或history.replaceState()方法。但有时使用history.replaceState()方法更改URL后,Vue Router可能无法感知URL的改变,从而不会更新视图,这可能是由于缺少路由监视或未调用Vue Router API的原因。…

    JavaScript 2023年6月11日
    00
合作推广
合作推广
分享本页
返回顶部