js中实现cookie的增删改查(document.cookie的使用详情)
一、设置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";
这时浏览器将维护两个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();
js中实现cookie的增删改查(document.cookie的使用详情)的更多相关文章
- node.js中对 mysql 进行增删改查等操作和async,await处理
要对mysql进行操作,我们需要安装一个mysql的库. 一.安装mysql库 npm install mysql --save 二.对mysql进行简单查询操作 const mysql = requ ...
- MVC3.0+knockout.js+Ajax 实现简单的增删改查
MVC3.0+knockout.js+Ajax 实现简单的增删改查 自从到北京入职以来就再也没有接触MVC,很多都已经淡忘了,最近一直在看knockout.js 和webAPI,本来打算采用MVC+k ...
- 在ASP.NET MVC4中实现同页面增删改查,无弹出框02,增删改查界面设计
在上一篇"在ASP.NET MVC4中实现同页面增删改查,无弹出框01,Repository的搭建"中,已经搭建好了Repository层,本篇就剩下增删改查的界面了......今 ...
- 用 JS(JavaScript )实现增删改查
JS小例题 学习内容: 需求 总结: 学习内容: 需求 用 JavaScript 实现简单增删改查 实现代码 <!DOCTYPE html PUBLIC "-//W3C//DTD HT ...
- 用CI框架向数据库中实现简单的增删改查
以下代码基于CodeIgniter_2.1.3版 用PHP向数据库中实现简单的增删改查(纯代码)请戳 http://www.cnblogs.com/corvoh/p/4641476.html Code ...
- Selenium入门13 cookie的增删改查
cookie的增删改查: 查询:get_cookies()查询所有cookie,get_cookie(cookie的name)获取单个cookie 删除:delete_cookie(cookie的na ...
- java程序设计课期中考试——数据库的增删改查和简单的js界面
首先是设计思路,对于数据库的增删改查,我们借助Ecilipse来进行前端和后端的编写.Ecilipse是可以进行java web项目的操作的. 前端,我们选择用使用jsp,所谓的jsp就是可以嵌入其他 ...
- 使用JS对HTML标签进行增删改查
以下为通过JS对li标签进行简单的增删改查: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...
- MVC中的Ajax与增删改查
自入手新项目以来,一直处于加班状态,博客也有两周没更,刚刚完成项目的两个模组,稍有喘息之机,写写关于项目中 的增删改查,这算是一个老生常谈的问题了,就连基本的教材书上都有.刚看书的时候,以为 没什么可 ...
随机推荐
- [UE4]哪些数据可以保存
基本类型的数据都可以保存(整型,浮点型等等)和容器类型(数组.结构体.Maps(字典表)). 复杂数据类型可以使用结构体把要保存的数据提出出来,通过保存结构体,达到保存复杂数据类型的目的.
- postgresql定位分析消耗CPU高的SQL语句
第一步:使用TOP命令查看占用CPU高的postgresql进程,并获取该进程的ID号,如图该id号为3640 第二步:切换到postgres用户,并且psql连接到数据库,执行如下查询语句 SELE ...
- 解决在word中不能使用输入法
打开一个Word文档-------------->单击 文件---->选项---->高级---->取消什么?看图 然后重新启动word
- SAS FORMAT 逻辑库存储 【输出格式 没有找到或无法加载】解决方法
SAS FORMAT 逻辑库存储 [输出格式 没有找到或无法加载]解决方法:需要指定FORMAT 搜索的路径:OPTIONS FMTSEARCH=(F WORK); 以下为完整示例代码: 00@DA ...
- 第11章 拾遗1:网络地址转换(NAT)和端口映射
1. 网络地址转换(NAT) 1.1 NAT的应用场景 (1)应用场景:允许将私有IP地址映射到公网地址,以减缓IP地址空间的消耗 ①需要连接Internet,但主机没有公网IP地址 ②更换了一个新的 ...
- 《Linux性能及调优指南》第二章:监控和基准工具2.1-2.2
翻译:飞哥 (http://hi.baidu.com/imlidapeng) 版权所有,尊重他人劳动成果,转载时请注明作者和原始出处及本声明. 原文名称:<Linux Performance a ...
- jmeter获取token并请求失败Internal authentication failed 400
jmeter访问token报错400 1.请求token地址 2.运行jmeter报错-run 3.400的意思是: 400(错误请求) 服务器不理解请求的语法. 4.报错信息如下 {"er ...
- JVM总结-虚拟机加载类
从 class 文件到内存中的类,按先后顺序需要经过加载.链接以及初始化三大步骤.其中,链接过程中同样需要验证:而内存中的类没有经过初始化,同样不能使用.那么,是否所有的 Java 类都需要经过这几步 ...
- api文档管理系统合集
1.Swagger 2.Showdoc 3.EOAPI 4.阿里的RAP 5.postMan 6.docute: 无需编译的文档撰写工具 7.SmartWiki 接口文档在线管理系统 8.SosoAp ...
- VMware扩展Linux根目录磁盘空间(Centos版本)
1.Centos 关机,选择编辑虚拟机设置,硬盘,在实用工具那里选择“扩展”,指定你需要的存储大小 2.启动客户机操作系统Centos,查看磁盘情况 输入指令 fdisk -l 显示结果如下 Disk ...