JavaScript倒计时案例实现

用输入时间的时间戳减去现在时间的时间戳即为倒计时的时间总毫秒数,实现js的倒计时效果

核心思想:

时间无法减去时间,有可能生成负数,所以采用时间戳的方法得到毫秒数形式的剩余时间,最后再把剩余时间转换为天、时、分、秒格式。

转换公式:

d = parseInt(总秒数/60/60/24);     // 计算天数
h = parseInt(总秒数/60/60 % 24);   // 计算小时
m = parseInt(总秒数/60 % 60);      // 计算分钟
s = parseInt(总秒数 % 60);         // 计算秒数

代码实现:

<script>
    //核心思想:设定时间-当前时间
    function countdown(time) {
        var inputime = +new Date(time);  //设定时间总毫秒数 = 传参时间
        var nowtime = +new Date();       //当前时间总毫秒数
        var times = (inputime - nowtime) / 1000; //1s = 1000ms

        //换算时间单位
        var d = parseInt(times / 24 / 60 /60);     //获得天数
        d = d < 10 ? '0' +d : d;
        var h = parseInt(times / 60 / 60 % 24);    //获得小时数,24小时之内
        h = h < 10 ? '0' +h : h;
        var m = parseInt(times / 60  % 60); //获得分钟数,60分钟之内
        m = m < 10 ? '0' +m : m;
        var s = parseInt(times  % 60);  //获得秒数,60秒之内
        s = s < 10 ? '0' +s : s;
        return d + '天' + h + '时' + m + '分' + s +'秒';
    }
    console.log(countdown('2020-7-14 00:00:00'));
</script>
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值