原生js对cookie的增删改查

一.增

document.cookie = cname + "=" + cvalue + ";expires=" + expires + ";path=/";
//分别
//cname为cookie的key
//cvalue为cookie的值与key直接=相连
//expires为cookie的过期时间前面用;与cvalue相连
//path为cookie的作用域默认为当前页面

其中expires的格式为Fri Sep 27 2019 14:27:25 GMT+0800 (中国标准时间)的一个对象.toUTCString

对于时间设置

var d = new Date();
d.setTime(d.getTime() + (n));//n的单位为毫秒
var expires = d.toUTCString();
专门建立的学习Q-q-u-n: 731771211,分享学习方法和需要注意的小细节,不停更新最新的教程和学习技巧
(从零基础开始到前端项目实战教程,学习工具,全栈开发学习路线以及规划)

二.改

用同样的key的名称覆盖就好了

三.查

查看全部document.cookie的结果为字符串,每个cookie之间都由;连接所有我们可以split(’;’)把里面的cookie进行分开

四.删

用同样的key的名称覆盖,把过期日期设置成过期即可

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,下面是原生DOM实现增删改查、全选反选的示例代码: ```html <!DOCTYPE html> <html> <head> <title>DOM增删改查、全选反选</title> </head> <body> <h3>DOM增删改查、全选反选示例</h3> <!-- 添加元素 --> <input type="text" id="add-input"> <button id="add-btn">添加</button> <!-- 显示元素列表 --> <ul id="list"></ul> <!-- 删除元素 --> <button id="delete-btn">删除</button> <!-- 修改元素 --> <input type="text" id="edit-input"> <button id="edit-btn">修改</button> <!-- 全选反选 --> <input type="checkbox" id="check-all"> <label for="check-all">全选/反选</label> <script> // 先获取相关的DOM元素 var addInput = document.getElementById('add-input'); var addBtn = document.getElementById('add-btn'); var list = document.getElementById('list'); var deleteBtn = document.getElementById('delete-btn'); var editInput = document.getElementById('edit-input'); var editBtn = document.getElementById('edit-btn'); var checkAll = document.getElementById('check-all'); // 添加元素 addBtn.onclick = function() { var text = addInput.value.trim(); if (text) { var li = document.createElement('li'); li.innerHTML = '<input type="checkbox"> ' + text; list.appendChild(li); addInput.value = ''; } }; // 删除元素 deleteBtn.onclick = function() { var checkboxes = list.getElementsByTagName('input'); for (var i = checkboxes.length - 1; i >= 0; i--) { if (checkboxes[i].checked) { list.removeChild(checkboxes[i].parentNode); } } }; // 修改元素 editBtn.onclick = function() { var checkboxes = list.getElementsByTagName('input'); for (var i = checkboxes.length - 1; i >= 0; i--) { if (checkboxes[i].checked) { var text = editInput.value.trim(); if (text) { checkboxes[i].parentNode.innerHTML = '<input type="checkbox"> ' + text; editInput.value = ''; } } } }; // 全选反选 checkAll.onclick = function() { var checkboxes = list.getElementsByTagName('input'); for (var i = checkboxes.length - 1; i >= 0; i--) { checkboxes[i].checked = checkAll.checked; } }; </script> </body> </html> ``` 这个示例实现了以下功能: 1. 输入框输入内容后,点击“添加”按钮可以将内容添加到列表中。 2. 点击“删除”按钮可以删除列表中选中的元素。 3. 输入框输入内容后,点击“修改”按钮可以将列表中选中的元素的文本修改为输入框中的内容。 4. 点击“全选/反选”复选框可以全选或反选列表中的所有元素。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值