js实现倒计时（天数，小时，分钟，秒）

男娘i 2022-03-26 03:06 554阅读 0赞

## 效果图 ##

![在这里插入图片描述][20190115114414465.png]  
封装好的js代码，引入一下就可以了，在html中直接调用，简单粗暴使用  
time.js

function TimeDown(id, endDateStr) {
        //结束时间
        var endDate = new Date(endDateStr);
        //当前时间
        var nowDate = new Date();
        //相差的总秒数
        var totalSeconds = parseInt((endDate - nowDate) / 1000);
        //天数
        var days = Math.floor(totalSeconds / (60 * 60 * 24));
        //取模（余数）
        var modulo = totalSeconds % (60 * 60 * 24);
        //小时数
        var hours = Math.floor(modulo / (60 * 60));
        modulo = modulo % (60 * 60);
        //分钟
        var minutes = Math.floor(modulo / 60);
        //秒
        var seconds = modulo % 60;
        //输出到页面
        document.getElementById(id).innerHTML = "剩余抢购:" + days + "天" + hours + "：" + minutes + "：" + seconds;
        //延迟一秒执行自己
        setTimeout(function () {
            TimeDown(id, endDateStr);
        }, 1000)
    }

test.html代码

//记住这里要引入js代码啊
    //例如我的：
     <script src="../js/time.js"></script>
    	<div id="timer"></div>
    	 <script>
            TimeDown('timer', '2019-01-20 8:00:00')//你想从未来的是么时候写就在这里把这个值修改一下'2019-01-20 8:00:00'
        </script>

[20190115114414465.png]: /images/20220326/1c44af0c3e1b45c9967abae462ba8fa8.png

发表评论取消回复

表情：

评论列表（有 0 条评论，554人围观）

还没有评论，来说两句吧...

相关阅读

相关 uniapp实现一个天，时，分，秒的倒计时

uniapp中实现一个天，时，分，秒的倒计时： ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_tex

港控/mmm°/ 2023年06月27日 12:40/ 0 赞/ 77 阅读

相关 JS_原生js实现60秒倒计时

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></t

约定不等于承诺〃/ 2023年02月20日 04:56/ 0 赞/ 32 阅读

相关 js 实现60秒倒计时

1.dom元素 <div class="box"> <h2>剩余时间：<span class="clock">60</span>秒</h2> <

清疚/ 2022年11月21日 03:59/ 0 赞/ 352 阅读

相关 js 当天24小时倒计时

var timer; // 当天最大时间戳 var endtime = new Date(new Date(new Dat

桃扇骨/ 2022年11月18日 02:28/ 0 赞/ 273 阅读

相关 vue.js中获取剩余的天数、小时、分钟、秒数

当我们从后台(php)拿到的时间是获取的是从1970年1月1日00:00:00距离的秒数。但是我们用js拿到的本机时间是1970年1月1日00:00:00距离的毫秒数。

本是古典何须时尚/ 2022年05月23日 09:23/ 0 赞/ 314 阅读

相关 js实现倒计时，精确到秒

效果图： ![70][] html代码： <!DOCTYPE html> <html> <head> <meta charset=

本是古典何须时尚/ 2022年05月15日 09:47/ 0 赞/ 270 阅读

相关 js实现倒计时（天数，小时，分钟，秒）

效果图 ![在这里插入图片描述][20190115114414465.png] 封装好的js代码，引入一下就可以了，在html中直接调用，简单粗暴使用 time.

男娘i/ 2022年03月26日 03:06/ 0 赞/ 555 阅读

相关用简单的JS实现秒倒计时

用简单的JS实现秒倒计时开发工具与关键技术：JavaScript 作者：陈希雄撰写时间：2019/2/9 当然，除了秒倒计时，还有时、分等等

àì夳堔傛蜴生んèń/ 2022年03月20日 01:52/ 0 赞/ 286 阅读

相关 javascript 倒计时天、小时、分钟、描述的倒计时代码

调用方法 var _TimeCountDown = new TimeCountDown("sttime1",{ startTime:'2016-07-30

缺乏、安全感/ 2021年12月22日 16:29/ 0 赞/ 478 阅读

相关 js 根据秒数获取多少小时，多少分钟，多少秒

// val:秒数 showTime(val){ if(val<60){ return val + "秒";

缺乏、安全感/ 2021年09月01日 10:54/ 0 赞/ 704 阅读