JS设置cookie、读取cookie、删除cookie


Posted in Javascript onApril 17, 2015

JavaScript是运行在客户端的脚本,因此一般是不能够设置Session的,因为Session是运行在服务器端的。

而cookie是运行在客户端的,所以可以用JS来设置cookie.

假设有这样一种情况,在某个用例流程中,由A页面跳至B页面,若在A页面中采用JS用变量temp保存了某一变量的值,在B页面的时候,同样需要使用JS来引用temp的变量值,对于JS中的全局变量或者静态变量的生命周期是有限的,当发生页面跳转或者页面关闭的时候,这些变量的值会重新载入,即没有达到保存的效果。解决这个问题的最好的方案是采用cookie来保存该变量的值,那么如何来设置和读取cookie呢?

首先需要稍微了解一下cookie的结构,简单地说:cookie是以键值对的形式保存的,即key=value的格式。各个cookie之间一般是以“;”分隔。

JS设置cookie:

假设在A页面中要保存变量username的值("jack")到cookie中,key值为name,则相应的JS代码为:

document.cookie="name="+username;

JS读取cookie:

假设cookie中存储的内容为:name=jack;password=123

则在B页面中获取变量username的值的JS代码如下:

var username=document.cookie.split(";")[0].split("=")[1];
//JS操作cookies方法!
//写cookies
function setCookie(name,value)
{
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}

读取cookies

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

删除cookies

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();
}
//使用示例
setCookie("name","hayden");
alert(getCookie("name"));
//如果需要设定自定义过期时间
//那么把上面的setCookie 函数换成下面两个函数就ok;
//程序代码
function setCookie(name,value,time)
{
var strsec = getsec(time);
var exp = new Date();
exp.setTime(exp.getTime() + strsec*1);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getsec(str)
{
alert(str);
var str1=str.substring(1,str.length)*1;
var str2=str.substring(0,1);
if (str2=="s")
{
return str1*1000;
}
else if (str2=="h")
{
return str1*60*60*1000;
}
else if (str2=="d")
{
return str1*24*60*60*1000;
}
}
//这是有设定过期时间的使用示例:
//s20是代表20秒
//h是指小时,如12小时则是:h12
//d是天数,30天则:d30
setCookie("name","hayden","s20");

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
基于jQuery的弹出消息插件 DivAlert之旅(一)
Apr 01 Javascript
JavaScript单元测试ABC
Apr 12 Javascript
jquery的trigger和triggerHandler的区别示例介绍
Apr 20 Javascript
兼容Firefox的Javascript XSLT 处理XML文件
Dec 31 Javascript
js表单提交和submit提交的区别实例分析
Dec 10 Javascript
JS中传递参数的几种不同方法比较
Jan 20 Javascript
canvas压缩图片转换成base64格式输出文件流
Mar 09 Javascript
在小程序中集成redux/immutable/thunk第三方库的方法
Aug 12 Javascript
如何让node运行es6模块文件及其原理详解
Dec 11 Javascript
JavaScript 链表定义与使用方法示例
Apr 28 Javascript
vue中echarts图表大小适应窗口大小且不需要刷新案例
Jul 19 Javascript
Vue实现购物车基本功能
Nov 08 Javascript
js获取当前日期时间及其它操作汇总
Apr 17 #Javascript
JS中完美兼容各大浏览器的scrolltop方法
Apr 17 #Javascript
jQuery检测输入的字符串包含的中英文的数量
Apr 17 #Javascript
JS获取图片高度宽度的方法分享
Apr 17 #Javascript
JS替换字符串中空格方法
Apr 17 #Javascript
最简单的JavaScript验证整数、小数、实数、有效位小数正则表达式
Apr 17 #Javascript
jQuery实现自定义事件的方法
Apr 17 #Javascript
You might like
一个更简单的无限级分类菜单代码
2007/01/16 PHP
dede3.1分页文字采集过滤规则详说(图文教程)续二
2007/04/03 PHP
源码分析 Laravel 重复执行同一个队列任务的原因
2017/12/25 PHP
javascript引用对象的方法代码
2007/08/13 Javascript
js兼容标准的表格变色效果
2008/06/28 Javascript
影响jQuery使用的14个方面
2014/09/01 Javascript
javascript显示中文日期的方法
2015/06/18 Javascript
javascript+ajax实现产品页面加载信息
2015/07/09 Javascript
JavaScript实现节点的删除与序号重建实例
2015/08/05 Javascript
jQuery对table表格进行增删改查
2020/12/22 Javascript
详解React项目的服务端渲染改造(koa2+webpack3.11)
2018/03/19 Javascript
在React项目中使用Eslint代码检查工具及常见问题
2018/10/10 Javascript
[04:42]5分钟带你了解什么是DOTA2(第一期)
2017/02/07 DOTA
python的urllib模块显示下载进度示例
2014/01/17 Python
Python with的用法
2014/08/22 Python
在SAE上部署Python的Django框架的一些问题汇总
2015/05/30 Python
将Django框架和遗留的Web应用集成的方法
2015/07/24 Python
python好玩的项目—色情图片识别代码分享
2017/11/07 Python
pyhton列表转换为数组的实例
2018/04/04 Python
python3 pandas 读取MySQL数据和插入的实例
2018/04/20 Python
Python批处理更改文件名os.rename的方法
2018/10/26 Python
利用ctypes获取numpy数组的指针方法
2019/02/12 Python
Django连接数据库并实现读写分离过程解析
2019/11/13 Python
非常震撼的纯CSS3人物行走动画
2016/02/24 HTML / CSS
英国品牌男装折扣网站:Brown Bag
2018/03/08 全球购物
详细的大学生创业计划书模板
2014/01/27 职场文书
修理厂厂长岗位职责
2014/01/30 职场文书
大学考试作弊检讨书
2014/01/30 职场文书
《乌塔》教学反思
2014/02/17 职场文书
毕业生简历自我评价范文
2014/04/09 职场文书
土建专业大学生自荐信范文
2014/04/09 职场文书
2014年学校国庆主题活动方案
2014/09/16 职场文书
2014年团总支工作总结
2014/11/21 职场文书
求职导师推荐信范文
2015/03/27 职场文书
班级联欢会主持词
2015/07/03 职场文书
初三化学教学反思
2016/02/22 职场文书