用js读、写、删除Cookie代码续篇


Posted in Javascript onDecember 03, 2014

上次的一篇文章:用js读、写、删除Cookie代码分享及详细注释说明,在实践中发现了一些问题:

1.cookie在本地文件上只能在火狐上调试,IE和chrome无效

2.cookie没有设置为永不过期,只考虑了设置一个时间段就过期,显然不太合理。

这次给出的是比较合理的cookie操作代码:

var Cookie = {

    get: function (k) {

        return ((new RegExp(["(?:; )?", k, "=([^;]*);?"].join(""))).test(document.cookie) && RegExp["$1"]) || "";

    },

    set: function (k, v, e, d) {

        var date=new Date(); 

        var expiresDays=e; 

        date.setTime(date.getTime()+expiresDays*24*3600*1000); 

        //如果有设置时间,则在规定时间内使用cookie,否则就是永不过期

        document.cookie=k+"="+v+"; expires="+ (e != '' ? date.toGMTString(): "GMT_String")+";path=/;domain="+ (d||'');

    },

    del: function (k) {

        var date=new Date(); 

        //将date设置为过去的时间

        date.setTime(date.getTime()-10000); 

        document.cookie=k+"=; expires="+date.toGMTString(); 

    }

};

例子演示的是:点击文字展开内容,再次点击隐藏。当内容为隐藏时,下次打开还是隐藏的,当内容为显示时,下次打开还是显示。

<div class="tab">

 <h3 class="tab-header">收缩</h3>

 <div class="tab-con" id="tabCon">

  <p>展开之后可见这里的内容</p>

 </div>

</div>

var btn = document.getElementsByTagName('h3')[0];

btn.addEventListener('click',function(){

 var isClose = this.getAttribute('data-isClose');

 if(isClose == 'close'){

  show();

  Cookie.del('flag');

 }else{

  hide();

  Cookie.set('flag','hide');

 }

});

var tabCon = document.getElementById('tabCon');

function show(){

 tabCon.style.display = 'block';

 btn.setAttribute('data-isClose','open');

 btn.innerHTML = '收缩';

}

function hide(){

 tabCon.style.display = 'none';

 btn.setAttribute('data-isClose','close');

 btn.innerHTML = '展开';

}

var flag = Cookie.get('flag');

if(flag == 'hide'){

 hide();

}
Javascript 相关文章推荐
表单元素的submit()方法和onsubmit事件应用概述
Feb 01 Javascript
IE的fireEvent方法概述及应用
Feb 22 Javascript
关于JavaScript中string 的replace
Apr 12 Javascript
JS+CSS实现模仿浏览器网页字符查找功能的方法
Feb 26 Javascript
JavaScript中的普通函数与构造函数比较
Apr 07 Javascript
基于Bootstrap的UI扩展 StyleBootstrap
Jun 17 Javascript
Vue组件BootPage实现简单的分页功能
Sep 12 Javascript
Vue.js进行查询操作的实例详解
Aug 25 Javascript
vue-rx的初步使用教程
Sep 21 Javascript
解决ele ui 表格表头太长问题的实现
Nov 13 Javascript
100行代码实现vue表单校验功能(小白自编)
Nov 19 Javascript
从0到1学习JavaScript编写贪吃蛇游戏
Jul 28 Javascript
js字符串完全替换函数分享
Dec 03 #Javascript
基于jquery实现等比缩放图片
Dec 03 #Javascript
javascript简单实现图片预加载
Dec 03 #Javascript
3种Jquery限制文本框只能输入数字字母的方法
Dec 03 #Javascript
javascript引擎长时间独占线程造成卡顿的解决方案
Dec 03 #Javascript
javascript中clone对象详解
Dec 03 #Javascript
javascript使用正则表达式检测IP地址
Dec 03 #Javascript
You might like
php微信公众平台开发(三)订阅事件处理
2016/12/06 PHP
yii2实现Ueditor百度编辑器的示例代码
2018/11/02 PHP
JavaScript判断两种格式的输入日期的正确性的代码
2007/03/25 Javascript
基于JavaScript创建动态Dom
2015/12/08 Javascript
jQuery的ajax下载blob文件
2016/07/21 Javascript
javascript 动态样式添加的简单实现
2016/10/11 Javascript
javascript中的后退和刷新实现方法
2016/11/10 Javascript
浅述节点的创建及常见功能的实现
2016/12/15 Javascript
理解javascript中的Function.prototype.bind的方法
2017/02/03 Javascript
微信小程序本作用域下调用全局JS详解及实例
2017/02/22 Javascript
JS简单生成随机数(随机密码)的方法
2017/05/11 Javascript
JS实现div模块的截图并下载功能
2017/10/17 Javascript
vue实现验证码输入框组件
2017/12/14 Javascript
vue非父子组件通信问题及解决方法
2018/06/11 Javascript
微信小程序中this.data与this.setData的区别详解
2018/09/17 Javascript
es6中class类静态方法,静态属性,实例属性,实例方法的理解与应用分析
2020/02/15 Javascript
JavaScript前后端JSON使用方法教程
2020/11/23 Javascript
python实现查询IP地址所在地
2015/03/29 Python
Python的Flask框架中SQLAlchemy使用时的乱码问题解决
2015/11/07 Python
Pandas之drop_duplicates:去除重复项方法
2018/04/18 Python
python 对类的成员函数开启线程的方法
2019/01/22 Python
Python实现一个数组除以一个数的例子
2019/07/20 Python
对pytorch的函数中的group参数的作用介绍
2020/02/18 Python
使用python求斐波那契数列中第n个数的值示例代码
2020/07/26 Python
C++和python实现阿姆斯特朗数字查找实例代码
2020/12/07 Python
python UDF 实现对csv批量md5加密操作
2021/01/01 Python
英国鞋类及配饰零售商:Kurt Geiger
2017/02/04 全球购物
意大利灯具购物网站:Lampade.it
2018/10/18 全球购物
航海技术专业毕业生求职信
2014/04/06 职场文书
抵押贷款承诺书
2014/05/30 职场文书
精神文明建设汇报材料
2014/12/24 职场文书
幼儿园综治宣传月活动总结
2015/05/07 职场文书
JavaScript原始值与包装对象的详细介绍
2021/05/11 Javascript
mysql在项目中怎么选事务隔离级别
2021/05/25 MySQL
Win11 S Mode版本泄露 正式上线后叫做Windows 11 SE
2021/11/21 数码科技
解决Oracle数据库用户密码过期
2022/05/11 Oracle