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的日期选择控件
Oct 27 Javascript
基于jquery的滚动新闻列表
Jun 19 Javascript
jquery下异步提交表单 异步跨域提交表单
Nov 17 Javascript
基于Jquery实现的一个图片滚动切换
Jun 21 Javascript
JS连连看源码完美注释版(推荐)
Dec 09 Javascript
jquery队列函数用法实例
Dec 16 Javascript
基于jquery实现省市区三级联动效果
Dec 25 Javascript
js验证框架实现代码分享
May 18 Javascript
如何在AngularJs中调用第三方插件库
May 21 Javascript
react中的ajax封装实例详解
Oct 17 Javascript
vue防止花括号{{}}闪烁v-text和v-html、v-cloak用法示例
Mar 13 Javascript
javascript canvas时钟模拟器
Jul 13 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 cli 方式 在crotab中运行解决
2010/02/08 PHP
PHP goto语句简介和使用实例
2014/03/11 PHP
浅析ThinkPHP的模板输出功能
2014/07/01 PHP
PHP解析目录路径的3个函数总结
2014/11/18 PHP
jQuery中文入门指南,翻译加实例,jQuery的起点教程
2007/01/13 Javascript
JS模拟多线程
2007/02/07 Javascript
jquery移动节点实例
2015/01/14 Javascript
JS实现可直接显示网页代码运行效果的HTML代码预览功能实例
2015/08/06 Javascript
你一定会收藏的Nodejs代码片段
2016/02/04 NodeJs
微信小程序-消息提示框实例
2016/11/24 Javascript
less简单入门(CSS 预处理语言)
2017/03/08 Javascript
纯jQuery实现前端分页功能
2017/03/23 jQuery
vue router使用query和params传参的使用和区别
2017/11/13 Javascript
利用angular、react和vue实现相同的面试题组件
2018/02/19 Javascript
Angular动态绑定样式及改变UI框架样式的方法小结
2018/09/03 Javascript
js实现web调用摄像头 js截取视频画面
2019/04/21 Javascript
使用 Element UI Table 的 slot-scope方法
2019/10/10 Javascript
基于node+vue实现简单的WebSocket聊天功能
2020/02/01 Javascript
微信小程序 button样式设置为图片的方法
2020/06/19 Javascript
[01:18]一目了然!DOTA2DotA快捷操作对比第一弹
2014/07/01 DOTA
python网络编程学习笔记(七):HTML和XHTML解析(HTMLParser、BeautifulSoup)
2014/06/09 Python
Python用Bottle轻量级框架进行Web开发
2016/06/08 Python
对numpy中array和asarray的区别详解
2018/04/17 Python
Python 使用PIL numpy 实现拼接图片的示例
2018/05/08 Python
Python socket实现的简单通信功能示例
2018/08/21 Python
Python JSON编解码方式原理详解
2020/01/20 Python
利用Tensorflow的队列多线程读取数据方式
2020/02/05 Python
Python利用命名空间解析XML文档
2020/08/10 Python
css3 伪类选择器快速复习小结
2019/09/10 HTML / CSS
荷兰音乐会和音乐剧门票订购网站:Topticketshop
2019/08/27 全球购物
国外软件测试工程师面试题
2016/12/09 面试题
军校制空专业毕业生自我鉴定
2013/11/16 职场文书
保护环境演讲稿
2014/05/10 职场文书
要账委托书范本
2014/09/15 职场文书
学校查摆问题整改措施
2014/09/28 职场文书
2014年办公室工作总结范文
2014/11/12 职场文书