【转】分享前端开发中通过js设置/获取cookie的一组方法
在前端开发中,通常都需要获取并记录用户的某些操作设置,这样可以使用户下一次访问网站时不用进行重复的调整设置同一个功能。
js方法的完整代码如下:
var cookie = {
set:function(key,val,time){//设置cookie方法
var date=new Date(); //获取当前时间
var expiresDays=time; //将date设置为n天以后的时间
date.setTime(date.getTime()+expiresDays*24*3600*1000); //格式化为cookie识别的时间
document.cookie=key + "=" + val +";expires="+date.toGMTString(); //设置cookie
},
get:function(key){//获取cookie方法
/*获取cookie参数*/
var getCookie = document.cookie.replace(/[ ]/g,""); //获取cookie,并且将获得的cookie格式化,去掉空格字符
var arrCookie = getCookie.split(";") //将获得的cookie以"分号"为标识 将cookie保存到arrCookie的数组中
var tips; //声明变量tips
for(var i=0;i<arrCookie.length;i++){ //使用for循环查找cookie中的tips变量
var arr=arrCookie[i].split("="); //将单条cookie用"等号"为标识,将单条cookie保存为arr数组
if(key==arr[0]){ //匹配变量名称,其中arr[0]是指的cookie名称,如果该条变量为tips则执行判断语句中的赋值操作
tips=arr[1]; //将cookie的值赋给变量tips
break; //终止for循环遍历
}
}
return tips;
}
}
代码中已经加入了注释,因此某些个别数值需要调整的话,可以自行修改代码。当然了,如果多加一两个参数也不是不可以,自行发挥吧。
下面简单的说明一下设置与获取的方法,便于前端开发新手用户使用:
1.设置cookie的方法为:cookie.set(key,val,time)
key可以理解为cookie的变量名
val可以理解为这个cookie所带有的值
time是cookie的超时时间,单位为天
2.获取cookie的方法为:cookie.get(key)
key就是刚才我们设置时的cookie变量名
我们只需要将函数赋值给新的变量即可调用这个值,例如:var n = cookie.get(key);
如何调试与查看cookie?
cookie可以通过某些浏览器的开发人员工具进行查看,本文暂以Chrome为例。
打开页面后,可以通过 “右键-> 审查元素 ->resources”,然后如下图中,设置了一个font-size为例,可以查看到变量名、值、和过期时间等信息

-------------------本宝宝再补充一丢丢-----------------------
1.关于设置或获取浏览器cookie(简而言之)
var cookies = document.cookie; //读取
document.cookie["Key"]="值"; //设置
2.关于在chrome中查看Cookie有个简便的方法,如下图:

-------------------------------补充完毕-------------------------------
转载原文链接 http://www.frontopen.com/1943.html
转载出处 品味人生 2014年03月02日 于 前端开拓者 发表
【转】分享前端开发中通过js设置/获取cookie的一组方法的更多相关文章
- 一探前端开发中的JS调试技巧
前言 调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问题.降低故障概率.帮助分析逻辑错误等等.而在互联网前端开发越来越重要的今 ...
- 前端开发中的JS调试技巧
前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问题.降低故障概率.帮助分析逻辑错误等等.而在互联网前端开发越来越重要的今 ...
- 【repost】一探前端开发中的JS调试技巧
有请提示:文中涉及较多Gif演示动画,移动端请尽量在Wifi环境中阅读 前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问 ...
- 一探前端开发中的JS调试技巧(转)
有请提示:文中涉及较多Gif演示动画,移动端请尽量在Wifi环境中阅读 前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问 ...
- web前端开发中常用的尺寸和位置
我们在日常web前端开发过程中,会经常用到各种尺寸和位置.通常是js做动画的时候.轮播图,滚屏动画,粒子,碰撞检测,拖拽,滚动加载等等.这里我将常用的尺寸和位置的获取进行总结,不包括canvas,SV ...
- 初学者Web介绍一些前端开发中的基本概念用到的技术
Web开发是比较费神的,需要掌握很多很多的东西,特别是从事前端开发的朋友,需要通十行才行.今天,本文向初学者介绍一些Web开发中的基本概念和用到的技术,从A到Z总共26项,每项对应一个概念或者技术. ...
- Web前端开发中的MCRV模式(转)
作者: izujian 来源: baiduux 摘要:针对前端开发中基于ajax的复杂页面开发所面临的代码规模大,难以组织和维护,代码复用性.扩展性和适应性差等问题,本文尝试以MVC思想为 基础,结 ...
- px em rem在WEB前端开发中的区别
我们都知道基于像素的字体大小所用的单位是px,但是随着响应式设计的不断火热,基于相对字体大小的单位em变开始流行起来.当然,rem也在Web前端开发人员讨论如何更好设置字体大小的讨论话题之列.是不是需 ...
- WEB前端开发中的图片压缩
web前端开发中,图片的重要性不言而喻,而由于一些图片的大小加上现在国内的网速不给力等种种原因,我们非常有必要对网站使用的图片进行压缩,压缩图片必然会带来图片质量的损失,我们要尽可能的在质量降低很小的 ...
随机推荐
- Gym 100247C Victor's Research(有多少区间之和为S)
https://vjudge.net/problem/Gym-100247C 题意: 给出一串数,求有多少个区间的和正好等于S. 思路:计算处前缀和,并且用map维护一下每个前缀和出现的次数.这样接下 ...
- ngui处理不规则按钮点击
吐个槽 棋牌类游戏做什么中国地图!!! 然后就要用到不规则按钮点击了 你懂的 213的unity虽然已经加入了polygoncollider 2d的支持 但是 但是 但是 是2d的 也就是说如果不 ...
- git tag 用法 功能作用
前言 最近使用git管理一个项目, 当需要将稳定的代码发布成一个版本,git的标签操作刚好满足需求 用途 标签可以针对某一时间点的版本做标记,常用于版本发布,这恰恰是我所需要的功能,将本地标签推送到G ...
- python特殊成员函数
1.__init__():构造函数 2.__del__():析构函数 3.print(__doc__):打印描述信息 4.print(Dog.__module__):类来自的模块 5.print(d1 ...
- js 动画效果实现
1. 实现方式 - 应用场景 自己写 - 简单的.不用 jq 的项目 jq - 普通动画 成熟插件 - 复杂动画 2. 相关文章 JavaScript基于时间的动画算法 九种原生js动画效果 Twee ...
- php 建站 多域名配置 自定义重定向
1. 申请一个域名 , 当多个域名使用. 比如 申请一个顶级域名为 .com 后缀的一级域名 :mine.com, 一般允许绑定四五个二级域名,比如 www.mine.com . mine.mine ...
- Codeforces 1079 E - The Unbearable Lightness of Weights
E - The Unbearable Lightness of Weights 思路: 分组背包dp 每组最多只能选一个 一些优化可以快很多 代码: #pragma GCC optimize(2) # ...
- jenkins之从0到1利用Git和Ant插件打war包并自动部署到tomcat(第五话):总结以及build.xml文件
前面基本上把整个配置过程都完整地串起来了,包括可能遇到的难点,按照那个套路应该可以配置好自动打包发布的功能.简单总结下我的学习过程,以及遇到问题是怎样解决的. 准备一个项目源码 刚开始在github和 ...
- 20170706xlVBA批量提取word表格中的自我评分
单位里普遍存在各种低效率的办公行为,比如每年的自我评分.评分细目表为word文档,每行一个项目,每个项目要填写得分事项和分值,组长审核之后转成Excel向上递交.主要涉及到问题就是word文档中一列得 ...
- You Don't Know JS: Scope & Closures (第2章: Lexical Scope)
2种主要的models for how scope work. 最普遍的是Lexical Scope. 另一种 Dynamic Scope.(在Appendix a中介绍.和Lexical Scope ...