前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >JavaScript对Cookie的增删改查

JavaScript对Cookie的增删改查

作者头像
Javanx
发布2019-09-04 15:43:13
9150
发布2019-09-04 15:43:13
举报
文章被收录于专栏:web秀

前言

JavaScript是运行在客户端的脚本,Session是运行在服务器端的,而Cookie是运行在客户端的,所以可以用JS来设置Cookie,而不能操作Session。 先了解一下Cookie的结构,简单地说:cookie是以键值对的形式存储的,即key=value的格式,各个cookie之间一般是以“;”分隔。 清除浏览器缓存Cookie是会被清除的。

原始方式

简单粗暴的操作

存储Cookie

代码语言:javascript
复制
let username = 'Javan';
document.cookie = "name=" + username;

读取Cookie

代码语言:javascript
复制
var cookieAll = document.cookie;
console.log(cookieAll);
// 输出后加工处理得到name值

方法封装

存储Cookie

expires是截止日期,到什么时间点,自动过期

代码语言:javascript
复制
function setCookie(name, value, days) {
  var exp = new Date();
  exp.setTime(exp.getTime() + days*24*60*60*1000);
  document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}

读取Cookie

代码语言:javascript
复制
function getCookie(name) {
  var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
  if (arr = document.cookie.match(reg)) {
    return unescape(arr[2]);
  } else {
    return null;
  }
}

测试

代码语言:javascript
复制
// 设置key为user, 值为Javanx
setCookie('user', 'Javanx', 1);
console.log(getCookie('user'));
// print Javanx

删除Cookie

代码语言:javascript
复制
function delCookie(name) {
  var exp = new Date();
  exp.setTime(exp.getTime() - 1);
  var cval=getCookie(name);
  if (cval!=null) {
    document.cookie= name + "=" + cval + ";expires=" + exp.toGMTString();
  }
}

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018年9月12日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 前言
  • 原始方式
    • 存储Cookie
      • 读取Cookie
      • 方法封装
        • 存储Cookie
          • 读取Cookie
            • 删除Cookie
            相关产品与服务
            对象存储
            对象存储(Cloud Object Storage,COS)是由腾讯云推出的无目录层次结构、无数据格式限制,可容纳海量数据且支持 HTTP/HTTPS 协议访问的分布式存储服务。腾讯云 COS 的存储桶空间无容量上限,无需分区管理,适用于 CDN 数据分发、数据万象处理或大数据计算与分析的数据湖等多种场景。
            领券
            问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档