Cookie的增删改查

Cookie的增删改查

什么是cookie?
cookies是由网络服务器存储在你电脑硬盘上的一个txt类型的小文件,它和你的网络浏览行为有关,所以存储在你电脑上的cookies就好像你的一张身份证,你电脑上的cookies和其他电脑上的cookies是不一样的;cookies不能被视作代码执行,也不能成为病毒,所以它对你基本无害。

1.原始方法

// 存储cookie
let uname  = 'Javan';document.cookie = "name"+uname;
// 读取cookie
var cookieAll = document.cookie;
console.log(cookieAll)

2.封装方法

 
 // 创建cookie的方法
"`<input type ="text" name = "t1" id="t1" value=""/>
<button type="button" onclick="createCookie()">创建cookie</button>
`"	
//获得输入框
var t1 = document.querySelector('t1')
function createCookie(){
let date_ = new Date()
date_.setDate(date_.getDate()+7)
document.cookie = `${t1.value} = ${t1.value};expires = ${date_}`
}
//获得cookie
for(var i of document.cookie.replace(/;/g,'').split(' ')){
if(i.split("=")[0]=='name'){
consile.log(i)
}
}

// 删除cookie,expires产时间,浏览器自动销毁
let date_ = new Date();
date_.setDate(date_.getDate()-1)
document.cookie = `sex = sex.expires ==${date_}`
// 修改cookie
document.cookie["uname"].value="李四"
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,关于cookie的封装,可以实现增删改查功能,以下是一个简单的实现: ```javascript // 封装cookie操作的工具函数 const cookieUtils = { // 获取cookie值 get(key) { const cookieStr = document.cookie; const cookieArr = cookieStr.split('; '); for (let i = 0; i < cookieArr.length; i++) { const itemArr = cookieArr[i].split('='); if (itemArr[0] === key) { return itemArr[1]; } } return null; }, // 设置cookie值 set(key, value, expires = 0, path = '/') { const date = new Date(); date.setTime(date.getTime() + expires * 24 * 60 * 60 * 1000); const expiresStr = expires === 0 ? '' : ';expires=' + date.toGMTString(); document.cookie = `${key}=${value};path=${path}${expiresStr}`; }, // 删除cookie值 remove(key, path = '/') { this.set(key, '', -1, path); }, // 更新cookie值 update(key, value, expires = 0, path = '/') { this.set(key, value, expires, path); }, }; ``` 使用方法如下: ```javascript // 设置cookie cookieUtils.set('username', 'Tom', 7, '/'); // 获取cookie const username = cookieUtils.get('username'); // 更新cookie cookieUtils.update('username', 'Jerry', 7, '/'); // 删除cookie cookieUtils.remove('username'); ``` 其中,`set`方法用于设置cookie值,第一个参数为cookie的名称,第二个参数为cookie的值,第三个参数为cookie的过期时间(单位为天),默认为0(表示在当前会话结束时过期),第四个参数为cookie的路径,默认为根路径。`get`方法用于获取cookie值,第一个参数为cookie的名称。`update`方法用于更新cookie值,其参数和`set`方法相同。`remove`方法用于删除cookie值,第一个参数为cookie的名称,第二个参数为cookie的路径,默认为根路径。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值