javascript cookie的简单应用


Posted in Javascript onFebruary 24, 2016

在我平时开发网页的过程中,可能涉及到浏览器本地的存储,现在主流的浏览器存储方式有:cookie,直接读取xml,userData,H5 的LocalStorage等,Cookie存储数据有限,但对于数据量不大的时候操作还是比较方便的。

下面这个例子主要是实现在网页打开的时候弹出一个提示框,但第二次以后刷新网页不在显示提示框,当然可以灵活的设置cookie的时间,控制是否显示提示框。

<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title></title>
</head>
<body>

<script>

  var cookie = {
    setCookie:function(name,value,iDay){
      var cookieStr = '';
      if(iDay == undefined){
        cookieStr += name+'='+value+';';
      }else{
        var oDate = new Date();
        oDate.setDate(oDate.getDate()+iDay);
        cookieStr += name+'='+value+';express='+oDate;
      }

      document.cookie = cookieStr;
    },
    getCookie:function(name){
      var arr = document.cookie.split(';');
      for(var i=0;i<arr.length;i++){
        var arr2 = arr[i].split('=');
        if(arr2[0] == name){
          return arr2[1];
        }
      }
      return '';
    },
    removeCookie:function(name){
      this.setCookie(name,'1',-1);
    }
  }

  function ControlAlert(){
    var flag = cookie.getCookie('flag');
    if(!flag){
      alert("我是第一次加载的哟!");
      cookie.setCookie('flag',true);
      //cookie.setCookie('flag',true,1);//如果有第三个参数则保存cookie的天数,如果不设置,浏览器关闭时cookie过期
    }
  }

  (function(){
    ControlAlert();
  }());

</script>
</body>
</html>

以上就是关于cookied的相关操作,希望对大家的学习有所帮助。

Javascript 相关文章推荐
被jQuery折腾得半死,揭秘为何jQuery为何在IE/Firefox下均无法使用
Jan 22 Javascript
jquery.boxy插件的iframe扩展代码
Jul 02 Javascript
Array栈方法和队列方法的特点说明
Jan 24 Javascript
jQuery实现右下角可缩放大小的层完整实例
Jun 20 Javascript
Axios学习笔记之使用方法教程
Jul 21 Javascript
使用Angular CLI从蓝本生成代码详解
Mar 24 Javascript
详解Vue webapp项目通过HBulider打包原生APP(vue+webpack+HBulider)
Feb 02 Javascript
Vue表单绑定的实例代码(单选按钮,选择框(单选时,多选时,用 v-for 渲染的动态选项)
May 13 Javascript
JS中数据结构与算法---排序算法(Sort Algorithm)实例详解
Jun 17 Javascript
超简单的微信小程序轮播图
Nov 22 Javascript
JavaScript实现旋转木马轮播图
Mar 16 Javascript
vue-cli脚手架的.babelrc文件用法说明
Sep 11 Javascript
javascript的正则匹配方法学习
Feb 24 #Javascript
适用于javascript开发者的Processing.js入门教程
Feb 24 #Javascript
JavaScript设计模式经典之命令模式
Feb 24 #Javascript
JavaScript设计模式经典之工厂模式
Feb 24 #Javascript
JavaScript的设计模式经典之建造者模式
Feb 24 #Javascript
JavaScript的设计模式经典之代理模式
Feb 24 #Javascript
jQuery实现验证年龄简单思路
Feb 24 #Javascript
You might like
php中理解print EOT分界符和echo EOT的用法区别小结
2010/02/21 PHP
PHP判断远程图片是否存在的几种方法
2014/05/04 PHP
PHP实现求连续子数组最大和问题2种解决方法
2017/12/26 PHP
php5.5使用PHPMailer-5.2发送邮件的完整步骤
2018/10/14 PHP
jQuery 研究心得 取得属性的值
2007/11/30 Javascript
JS 分号引起的一段调试问题
2009/06/18 Javascript
获取URL地址中的文件名和参数的javascript代码
2009/09/02 Javascript
ASP.NET jQuery 实例10 动态修改hyperlink的URL值
2012/02/03 Javascript
Three.js源码阅读笔记(基础的核心Core对象)
2012/12/27 Javascript
JavaScript简单修改窗口大小的方法
2015/08/03 Javascript
深入理解Ajax的get和post请求
2016/06/02 Javascript
js 动态生成html 触发事件传参字符转义的实例
2017/02/14 Javascript
利用Angular+Angular-Ui实现分页(代码加简单)
2017/03/10 Javascript
Angular 容器部署的方法
2018/04/17 Javascript
webpack配置proxyTable时pathRewrite无效的解决方法
2018/12/13 Javascript
vue cli3.0结合echarts3.0与地图的使用方法示例
2019/03/26 Javascript
JS实现的自定义map方法示例
2019/05/17 Javascript
javascript防抖函数debounce详解
2019/06/11 Javascript
JS实现拖动模糊框特效
2020/08/25 Javascript
vue-cli3自动消除console.log()的调试信息方式
2020/10/21 Javascript
基于javascript实现移动端轮播图效果
2020/12/21 Javascript
[01:21:58]守擂赛DOTA2第一周决赛
2020/04/22 DOTA
微信小程序跳一跳游戏 python脚本跳一跳刷高分技巧
2018/01/04 Python
pytorch 加载(.pth)格式的模型实例
2019/08/20 Python
浅谈pytorch、cuda、python的版本对齐问题
2020/01/15 Python
西班牙土拨鼠床垫公司,感觉在云端:Marmota
2019/03/18 全球购物
潘多拉珠宝俄罗斯官方网上商店:PANDORA俄罗斯
2020/09/22 全球购物
非功能性需求都包括哪些方面
2013/10/29 面试题
文科生自我鉴定
2014/02/15 职场文书
现场施工员岗位职责
2014/03/10 职场文书
2014超市双十一活动策划方案
2014/09/29 职场文书
永不妥协观后感
2015/06/10 职场文书
社区志愿服务活动感想
2015/08/07 职场文书
pycharm2021激活码使用教程(永久激活亲测可用)
2021/03/30 Python
nginx从安装到配置详细说明(安装,安全配置,防盗链,动静分离,配置 HTTPS,性能优化)
2022/02/12 Servers
SpringBoot详解执行过程
2022/07/15 Java/Android