当前位置:首页 > 日记 > 正文

js实现倒计时关键代码

js实现倒计时关键代码

我们经常会在一些电商网站上看到秒杀倒计时,双11倒计时.其实倒计时的效果实现起来也是很简单的,并不复杂.

首先呢,开始写之前一定要理清楚思路,思路清晰了,那写起来就容易多了,下面我分了几个步骤:

1.获取当前的时间,并且定义结束的时间

2.用求未来时间和当前时间的时间差,并且求出时分秒

3.设置定时器,让时间每秒递减

var div = document.getElementsByTagName("div")[0];      var timer = setInterval(timers, 1000);      function timers() {        //获取现在的时间        var now = new Date();        //获取你想要的未来时间        var future = new Date("2017/05/10");        var time = future.getTime() - now.getTime();        //获取距离的天数        var day = parseInt(time / 24 / 60 / 60 / 1000);        //获取距离的小时        var hour = parseInt(time / 1000 / 60 / 60 % 24);        //获取分        var minute = parseInt(time / 1000 / 60 % 60);        //获取秒        var sec = parseInt(time / 1000 % 60);        if(time < 0) {          div.innerHTML = "距离苹果发布会还有00天00小时00分00秒000毫秒";          clearInterval(timer);          return;        }        //注意点:当时间小于10的时候,要在前面补0        div.innerHTML = "距离结束时间还有" + (day < 10 ? ("0" + day) : day) + "天" + (hour < 10 ? ("0" + hour) : hour) + "小时" + (minute < 10 ? ("0" + minute) : minute) + "分" + (sec < 10 ? ("0" + sec) : sec) + "秒";      }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

相关文章

nodejs中向HTTP响应传送进程的输出

nodejs中向HTTP响应传送进程的输出

响应,传送,进程,输出,输出进程,废话不多说了,直接给大家贴代码了,具体代码如下所述:var spawn = require('child_process').spawn;require('http').createServer(function(req, res) { var child = spawn('tail', ['-f', '/var/log/s…

2016的给力qq签名

2016的给力qq签名

大全,电脑软件,qq,  记住,你要活得和毒品一样、要么不能弃,要么惹不起。哪些签名是你喜欢的呢?下面小编给大家分享了关于2016的给力qq签名,希望你喜欢。2016的给力qq签名大全1) &ldquo;你瞒着所有人在爱谁&rdquo;2) 我可以带你混的风生水起…

excel表格计算绝对值的方法excel表

excel表格计算绝对值的方法excel表

计算,方法,绝对值,表格,电脑软件,  Excel中经常需要使用到函数计算绝对值,用函数具体该如何计算绝对值呢?接下来是小编为大家带来的excel表格计算绝对值的方法,供大家参考。excel表格计算绝对值的方法计算绝对值步骤1:如下图,我们要计算A1:A7…

Excel2013怎么用姓名查找其所在位

Excel2013怎么用姓名查找其所在位

查找,步骤,所在位置,姓名,表格,  在一份有着成百上千个名单的excel表格,想要从中找出一个人所在的位置,确实有点难度,但是,因为你用的是excel,所以不用担心,因为有函数这一强大的功能,所以一切都迎刃而解,下面小编就教你怎么用函数从众多名单中找…

Excel向程序发送命令时出现问题怎

Excel向程序发送命令时出现问题怎

命令,程序,办法,电脑软件,Excel,  有时候会忽然间不知道什么原因,在打开Excel时提示&ldquo;向程序发送命令时出现问题&rdquo;,导致无法正常打开Excel文件,虽然可以通过多种途径,曲线解决,但都不是长久之计。下面下编教你怎么根治这个问题。Exc…

微信小程序 边框解决方法

微信小程序 边框解决方法

解决方法,边框,程序,电脑软件,微信小,微信小程序 图片边框问题解决在最开始对网页进行构建的时候,我们并不知道网站中需要放置那些特定的图片,所以我们往往会放置一个空的img标签,但是这样的话,图片标签因为没有src的值,所以在网站中会显示出来…

javascript基础进阶_深入剖析执行

javascript基础进阶_深入剖析执行

作用域链,执行环境,进阶,基础,电脑软件,执行环境执行环境定义了变量或函数有权访问的其他函数,决定了他们各自的行为。每个执行环境都有一个与之关联的变量对象。变量对象环境中定义的所有变量和函数都保存在这个对象中。全局执行环境全局执…

js控制文本框禁止输入特殊字符详解

js控制文本框禁止输入特殊字符详解

控制,文本框,特殊字符,禁止输入,详解,在开发难免遇到一些前端需要验证输入的数据是否合法的问题,收集分享在这里同学们使用,欢迎补充。1.标签上直接替换方法:JS 控制不能输入特殊字符<input type="text"class="domain"onkeyup="this.valu…

退出Excel 2007程序窗口有什么方法

退出Excel 2007程序窗口有什么方法

退出,方法,有什么,窗口,程序,  在我们不使用Excel 2007程序时,就应该将其关闭。退出Excel 2007程序窗口,通常会有以下两种方法。以下是小编为您带来的关于退出Excel 2007程序窗口,希望对您有所帮助。退出Excel 2007程序窗口1、主菜单退出Exc…

Excel表格如何制作项目文件目录表

Excel表格如何制作项目文件目录表

文件目录,项目,表格,电脑软件,Excel,  日常工作中,一个项目的文件往往会有很多个,在Excel中制作一个项目文件目录,可以快速方便的查看不同的文件。以下是小编为您带来的关于Excel表格制作项目文件目录表,希望对您有所帮助。Excel表格制作项目…

Word标题段落如何设计的层次分明

Word标题段落如何设计的层次分明

段落,分明,标题,电脑软件,Word,  我们在Word文档写文章的时候,有很多并列的段落,要让内容更有层次感,应该怎么设置?以下是小编为您带来的关于Word标题段落设计的层次分明,希望对您有所帮助。Word标题段落设计的层次分明1、打开需要编辑的文件…

excel2010填充颜色快捷键教程excel

excel2010填充颜色快捷键教程excel

填充,快捷键,教程,颜色,快速,  在Excel中很多功能都拥有快捷键,这些快捷键能让用户更加快的完成工作,提高工作效率,其中填充颜色就是最好的例子,填充颜色的快捷键具体要如何操作呢?接下来是小编为大家带来的excel2010填充颜色快捷键教程,供大…