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 相关文章推荐
更正确的asp冒泡排序
May 24 Javascript
入门基础学习 ExtJS笔记(一)
Nov 11 Javascript
可在线编辑网页文字效果代码(单击)
Mar 02 Javascript
jQuery中bind与live的用法及区别小结
Jan 27 Javascript
JavaScript通过prototype给对象定义属性用法实例
Mar 23 Javascript
jQuery 全选 全部选 反选 实现代码
Aug 17 Javascript
bootstrap学习使用(导航条、下拉菜单、轮播、栅格布局等)
Dec 01 Javascript
jq stop()和:is(:animated)的用法及区别(详解)
Feb 12 Javascript
BootStrap TreeView使用实例详解
Nov 01 Javascript
详解AngularJS之$window窗口对象
Jan 17 Javascript
jQuery实现验证用户登录
Dec 10 jQuery
微信小程序利用云函数获取手机号码
Dec 17 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
PHP 获取目录下的图片并随机显示的代码
2009/12/28 PHP
codeigniter自带数据库类使用方法说明
2014/03/25 PHP
php mysql PDO 查询操作的实例详解
2017/09/23 PHP
Javascript实现的类似Google的Div拖动效果代码
2011/08/09 Javascript
jQuery模拟超链接点击效果代码
2013/04/21 Javascript
鼠标拖动实现DIV排序示例代码
2013/10/14 Javascript
JavaScript中setTimeout和setInterval函数的传参及调用
2016/03/11 Javascript
获取JS中网页各种高宽与位置的方法总结
2016/07/27 Javascript
jquery表单验证插件validation使用方法详解
2017/01/20 Javascript
原生JS实现简单放大镜效果
2017/02/08 Javascript
浅谈js中的变量名和函数名重名
2017/02/13 Javascript
Iscrool下拉刷新功能实现方法(推荐)
2017/06/26 Javascript
JS对象序列化成json数据和json数据转化为JS对象的代码
2017/08/23 Javascript
node中间层实现文件上传功能
2018/06/11 Javascript
通过封装scroll.js 获取滚动条的值
2018/07/13 Javascript
Vue-cli@3.0 插件系统简析
2018/09/05 Javascript
React Native中Mobx的使用方法详解
2018/12/04 Javascript
Vue.js组件props数据验证实现详解
2019/10/19 Javascript
Vue替代marquee标签超出宽度文字横向滚动效果
2019/12/09 Javascript
vue实现在线学生录入系统
2020/05/30 Javascript
Vue 构造选项 - 进阶使用说明
2020/08/14 Javascript
Python实现从订阅源下载图片的方法
2015/03/11 Python
Python 和 JS 有哪些相同之处
2017/11/23 Python
解析Python中的eval()、exec()及其相关函数
2017/12/20 Python
Python字符串格式化%s%d%f详解
2018/02/02 Python
html5实现微信打飞机游戏
2014/03/27 HTML / CSS
资生堂美国官网:Shiseido美国
2016/09/02 全球购物
Tessabit美国:集世界奢侈品和设计师品牌的意大利精品买手店
2020/06/29 全球购物
产品工艺师的岗位职责
2013/11/15 职场文书
高中生家长会演讲稿
2014/01/14 职场文书
出纳年终工作总结2014
2014/12/05 职场文书
2014业务员年终工作总结
2014/12/09 职场文书
2015年信贷员工作总结
2015/04/28 职场文书
在人间读书笔记
2015/06/30 职场文书
我的中国梦心得体会范文
2016/01/05 职场文书
Vite + React从零开始搭建一个开源组件库
2022/06/25 Javascript