JavaScript 封装 Cookie 操作的实用技巧

最新推荐文章于 2024-08-01 10:07:32 发布
最新推荐文章于 2024-08-01 10:07:32 发布
阅读量14 收藏
点赞数
文章标签： javascript 前端 开发语言 js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/CsCufft/article/details/133433423
版权
js 专栏收录该内容
299 篇文章 6 订阅 ¥59.90 ¥99.00
订阅专栏

在前端开发中，Cookie 是一种常用的数据存储方式，它可以在浏览器和服务器之间传递数据。JavaScript 提供了一些内置方法来处理 Cookie，但是为了更方便地使用和管理 Cookie，我们可以封装一些自定义的函数。本文将介绍几个实用的 JavaScript 技巧，用于封装 Cookie 操作，并提供相应的源代码示例。

  1. 设置 Cookie
    设置 Cookie 是存储数据的第一步。以下是一个封装的函数，用于设置 Cookie：
function setCookie(name, value, days) {
   
  var expires = "";
  if (days)
了解本专栏 订阅专栏 解锁全文
CsCufft
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
订阅专栏
JavaScript 对 cookie 的基本操作封装
qq_42372534的博客
05-09 234
JavaScript 对 cookie 的基本操作封装 来自 JavaScript 高级程序设计(第四版) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="w
JavaScript封装cookie操作
weixin_41897680的博客
05-24 550
定义cookie()函数来封装cookie的所有操作 描述： cookie()函数即可以写入指定的cookie信息，删除指定的cookie信息，同时也能够读取指定名称的cookie值，另外还可以指定cookie信息的有效期、有效路径、作用域和安全性选项设置 指定一个参数表示读取指定名称的cookie值 指定两个参数，则表示写入cookie信息，第一个参数表示名称，第二个参数表示值 第三个参数传递选项信息，以字典形式存储在对象中进行传递。包括有效期、有效路径、有效域和是否加密数据传输 function c
原生JavaScript封装cookie工具类
qq_41591368的博客
12-01 126
export default{ /* 设置cookie key:String 键名 val:String 值 expires:string 到期时间 单位秒 */ setCookie(key,val,expires){ let nowTime = new Date().getTime(); let endTime = new Date(nowTime + expires*1000);
[javascript] js封装cookie操作函数
程序员老狼专注开发aigc或客服系统应用
05-10 144
简单封装一下js操作cookie的函数 //设置cookie function setCookie(name,value,expireTime) { var exp = new Date(); exp.setTime(exp.getTime() + expireTime*1000); document.cookie = name + "="+ escape (value...
javascript制作的cookie封装及使用指南
10-24
这篇教程主要讲解了如何使用JavaScript封装一个方便操作Cookie的工具类，包括创建、读取、删除和清空Cookie的方法。 首先，封装Cookie的主要目的是为了提高代码的可读性和可维护性，避免每次都直接操作`document....
JavaScript 对Cookie 操作的封装小结
10-29
本文将探讨如何通过JavaScript来封装对Cookie的操作，同时介绍匿名函数、闭包以及如何模拟私有（private）和公共（public）访问权限的概念。 首先，让我们关注JavaScript中的匿名函数。匿名函数是指没有名称的函数...
javascript封装 Cookie 应用接口
10-23
本文通过几个简单的示例向大家展示了javascript封装cookie的注意事项及操作方法，非常的简单实用，最后附上一则具体实例，有需要的小火把可以参考下。
Javascript Cookie操作类的封装
01-28
接下来，我们来创建一个名为`CookieManager`的JavaScript类，用于封装Cookie的操作。这个类需要包含以下方法： 1. **setCookie**：用于设置Cookie。需要传入键（key）、值（value）以及可选的过期时间（days）和...
VUE3自定义指令防止重复点击多次提交
MadSnail00的博客
07-30 256
vue3连续点击按钮重复提交，vue3自定义指令防止重复提交
Vue3中的pinia的使用及组合写法与普通写法的区别
m0_62626838的博客
07-30 159
1、首先pinia可以自己后面按需安装，也可在项目创建时去勾选安装（这里我使用的是项目创建时自动安装的，吃了点亏，忘记这里是组合写法了）按照这个写法是不需要添加pinia核心（state、actions、getters），但需要return！store文件夹中的counter.ts （名字任起）在组件中直接使用即可，如下图。2、自定义安装pinia。3、在组件中使用，如下图。
【分享】前端程序员-技术网站推荐
一位前行者的博客
07-30 573
对于前端开发人员来说，以下是一些推荐的技术网站，这些网站提供了丰富的资源和知识，可以帮助你提升前端开发技能：收集一些 、、 的网站 vite 官方中文文档 element-plus 官方中文文档 pinia 官方中文文档 vue-router 官方中文文档 Tailwind CSS 官方文档 vitest 官方中文文档 es6 中文文档 axios 官方中文文档 vxetable 官方中文文档 lodash 中文文档 echarts 官方中文文档 animat
RN高级interview
流星雨的博客
07-31 389
RN高级interview
我们的前端开发逆天了！1 小时搞定了新网站，还跟我说 “不要钱”
努力做最接地气的编程干货分享，感谢关注
07-29 2021
本文将带你了解一个新的 Web 框架 **Astro**，并手把手带你使用 Astro 搭建一个属于自己的站点，用过的都说真香！
linux命令行下使用的浏览器
最新发布
没刮胡子的程序员专栏
08-01 20
从命令行浏览网页的原因有很多。 命令行工具通常具有丰富的选项和参数，可以根据用户的需求进行调整和配置。这种灵活性使得命令行在自动化和脚本编写方面非常有用。 对于系统管理员来说，命令行是管理和配置服务器的首选方式。通过命令行，管理员可以快速执行各种任务，例如安装软件包、配置网络、管理用户和权限等。与图形界面相比，命令行通常更高效，特别是在处理大量的重复性任务时。 使用Linux命令行浏览器可以提高工作效率，降低系统资源消耗，提高系统的稳定性。
新手vue学习问题汇总（自用）（长期更新）
lapiii的博客
07-28 380
是 ES6 模块语法，用于导出模块的默认成员。在 Vue.js 中，通常用来导出一个组件对象，使其可以在其他文件中被导入并使用。
angular入门基础教程(四）动态属性与事件
峰会路转的博客
07-29 178
状态的变化导致属性值的变化，这个时候我们就需要用到动态属性，ng中的动态属性用[]包裹即可。
easyui 点击单元格的时候，获取该行另外一个字段的值
极客栈
07-29 389
通过绑定 DataGrid 的 ​​ 事件，可以轻松地在单击单元格时获取该行的其他字段值。这个方法适用于各种场景，比如在用户点击某个单元格时显示额外的信息、执行特定的操作等。希望这个示例能帮助你更好地理解和应用 EasyUI DataGrid 的事件处理。
easyadmin layui js监听返回结果，进行token验证防止连点
weixin_43652106的博客
07-29 258
easyadmin layui js监听返回结果，进行token验证防止连点
js封装cookie
09-10
要封装 JavaScript 的 Cookie，可以创建一个名为 "CookieUtil" 的对象，并为该对象定义一些方法来处理 Cookie。以下是一个基本的示例： ```javascript var CookieUtil = { // 获取指定名称的 Cookie 值 get: function(name) { var cookieName = encodeURIComponent(name) + "=", cookieStart = document.cookie.indexOf(cookieName), cookieValue = null; if (cookieStart > -1) { var cookieEnd = document.cookie.indexOf(";", cookieStart); if (cookieEnd == -1) { cookieEnd = document.cookie.length; } cookieValue = decodeURIComponent(document.cookie.substring(cookieStart + cookieName.length, cookieEnd)); } return cookieValue; }, // 设置 Cookie set: function(name, value, expires, path, domain, secure) { var cookieText = encodeURIComponent(name) + "=" + encodeURIComponent(value); if (expires instanceof Date) { cookieText += "; expires=" + expires.toGMTString(); } if (path) { cookieText += "; path=" + path; } if (domain) { cookieText += "; domain=" + domain; } if (secure) { cookieText += "; secure"; } document.cookie = cookieText; }, // 删除指定名称的 Cookie remove: function(name, path, domain, secure) { this.set(name, "", new Date(0), path, domain, secure); } }; ``` 使用示例： ```javascript // 设置一个名为 "username" 的 Cookie，有效期为一天 CookieUtil.set("username", "John Doe", new Date(Date.now() + (24 * 60 * 60 * 1000))); // 获取名为 "username" 的 Cookie 值 var username = CookieUtil.get("username"); console.log(username); // 删除名为 "username" 的 Cookie CookieUtil.remove("username"); ``` 这只是一个简单的封装示例，你可以根据需要进行扩展和修改。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值