js中实现cookie的增删改查(document.cookie的使用详情)

左手的ㄟ右手 2022-07-14 13:14 210阅读 0赞

一、设置cookie的值

1、每个cookie都是一个名称/值对，名称/值对用等号连接，并将该名称/值对赋值给document.cookie即可。如：document.cookie="id=77";

2、如果要一次存储多个名称/值对，可以使用分号加空格隔开。如：document.cookie="id=77; name=bill";

在cookie的名或值中不能使用分号（;）、逗号（,）、等号（=）以及空格。如果想存入这些值，我们可以使用escape()函数进行编码，它能将一些特殊符号使用十六进制表示，例如空格将会编码为“%20”，从而可以存储于cookie值中。

例如：

document.cookie="str="+escape("Hello World");

相当于：

document.cookie="str=Hello%20World";

当使用escape()编码后，在取出值以后需要使用unescape()进行解码才能得到原来的cookie值。

3、document.cookie可以赋不同的值，如：

document.cookie="id=77";

document.cookie="name=bill";

这时[浏览器][Link 1]将维护两个cookie，分别是id和name

二、修改cookie的值

如果要改变一个cookie的值，只需重新赋值，例如：document.cookie="id=88";

这样cookie中id的值就变成成了88

三、获取cookie的值

cookie的值可以由document.cookie直接获得：var strCookie=document.cookie;

如果是一次存入多个名称/值对，可以将获取到的字符串进行遍历。

例：//添加cookie

document.cookie="id=77; name=bill";

//获取存入到cookie的值,strCookie的值就为 id=77;name=bill

var strCookie=document.cookie;

//写个方法进行遍历

function getCookieValue(name) \{

var strCookie=document.cookie;

var arrCookie=strCookie.split(";");

for(var i=0;i<arrCookie.length;i++)\{

var c=arrCookie\[0\].split("=");

if(c\[0\]==name)\{

return c\[1\];

\}

\}

return "";

\}

该方法可以根据存入cookie的名称，获取对应的值。如getCookieValue("name"),得到结果就是bill

四、给cookie设置终止时间

cookie都是单会话的，即浏览器关闭后这些cookie将会丢失，事实上这些cookie仅仅是存储在内存中，而没有建立相应的硬盘文件。

在实际开发中，cookie常常需要长期保存，例如保存用户登录的状态。这可以用下面的选项来实现：

document.cookie="userId=828; expires=GMT\_String";

这样可以设置cookie在这个时间内都是有效的。

例：设置cookie的有效时间是10分钟

//获取当前时间

var date=new Date();

var expireDays=10;

//将date设置为10天以后的时间

date.setTime(date.getTime()+expireDays\*60\*1000);

//将id和name两个cookie设置为10天后过期

document.cookie="id=77; name=bill; expires="+date.toUTCString();

五、删除cookie

直接将cookie的有效时间设置成过去即可。如

var date=new Date();

date.setTime(date.getTime()-1000)

document.cookie="id=77; name=bill; expires="+date.toUTCString();

[Link 1]: http://www.2cto.com/os/liulanqi/

发表评论取消回复

表情：

评论列表（有 0 条评论，210人围观）

还没有评论，来说两句吧...

相关阅读

相关用 JS（JavaScript ）实现增删改查

JS小例题学习内容：需求总结：学习内容：需求用 JavaScript 实现简单增删改查实现代码 <!DO

蔚落/ 2023年01月16日 06:56/ 0 赞/ 151 阅读

相关 mysql增删改查_MySQL的基本使用——简单的增删改查

MySQL是现在使用最多的关系型数据库，我们下面来学习一下如何用sql语句进行基本的创建数据库、创建表、向表中插入数据、从表中删除数据、更新表等操作。 1.创建一个数据库:我

矫情吗；*/ 2023年01月10日 15:58/ 0 赞/ 343 阅读

相关使用JDBC实现数据库的增删改查

1、实现步骤 1.1、导入jar包在libs文件夹下复制jar包，没有libs文件夹新建一个 [ jar下载][jar]（提取码：s5o5）

╰半夏微凉°/ 2022年11月27日 03:07/ 0 赞/ 193 阅读

相关基础的java增删改查,Java基础系列（基础）：Java使用Cookie增删改查操作！

什么是Cookie? Cookie是由W3C组织提出，最早由NetScape社区发展的一种机制。 Cookie是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求

不念不忘少年蓝@/ 2022年11月18日 05:58/ 0 赞/ 212 阅读

相关 Java实现对cookie的操作(增删改查)

/ 读取所有cookie 注意二、从客户端读取Cookie时，包括maxAge在内的其他属性都是不可读的，也不会

Bertha 。/ 2022年09月26日 12:57/ 0 赞/ 228 阅读

相关 js中实现cookie的增删改查(document.cookie的使用详情)

一、设置cookie的值 1、每个cookie都是一个名称/值对，名称/值对用等号连接，并将该名称/值对赋值给document.cookie即可。如：document.coo

左手的ㄟ右手/ 2022年07月14日 13:14/ 0 赞/ 211 阅读

相关使用AJAX实现数据的增删改查

主页：index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8">

￡神魔★判官ぃ/ 2022年05月18日 00:17/ 0 赞/ 259 阅读

相关使用MyBatis实现增删改查

常用的方式实现 1.编写sql映射文件 ![70][] 2.在conf.xml文件中对映射文件进行注册 ![70 1][] 3.编写测试类代码

r囧r小猫/ 2022年05月13日 04:08/ 0 赞/ 342 阅读

相关【原生】js实现表格的增删改查

说在前面的，写给小白白的，大神请绕道~ 今天用原生js写一下动态表格的增删改查，主要是熟悉一下js的DOM操作。首先，做一个表格，用来显示提交的数据，如图下： ![10

短命女/ 2021年12月03日 23:29/ 0 赞/ 327 阅读

相关 node.js实现图书增删改查

实现图书的增删改查 1.分析 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0c

爱被打了一巴掌/ 2021年11月18日 00:58/ 0 赞/ 457 阅读