首页 > 技术文章 > 使用js写简易的倒计时

kinblog 2019-04-17 15:09 原文

步骤

1.获取span标签
2.获取现在的时间戳

3.获取未来的时间戳

4.将未来时间戳减去现在的时间戳等于相差的秒数

5.输出到页面

直接上代码

<span name="os">00d 00h 00m 00s</span>
<script>
    // 获取span标签
    osp = document.getElementsByName("os")[0];

    // 一位数字的时候在前面加个0
    function tow(n) {
        return n >= 0 && n < 10 ? "0" + n : n;
    }

    function getDate(){
        // 获取现在的时间戳
        var nowdate = new Date();
        // 获取时间戳的毫秒数
        var nowtime = nowdate.getTime();

        // 获取未来的时间戳
        var newdate = new Date("2020/1/11 18:00:00");
        var newtime = newdate.getTime();

        // 将未来时间戳减去现在的时间戳等于相差的秒数
        var second = Math.floor((newtime - nowtime)/1000);

        // 一天等于86400秒,所以将相差的秒数除以86400等于剩余天数(math.floor向下取整)
        var day = Math.floor(second/86400);
        // 将秒数取余86400,等于剩余秒数
        second %= 86400;

        // 一小时等于3600秒,所以将相差的秒数除以3600等于剩余小时(math.floor向下取整)
        var hour = Math.floor(second/3600);
        second %= 3600;

        var minute = Math.floor(second/60);
        second %= 60;

        var ost = tow(day) + "d " + tow(hour) + "h " + tow(minute) + "m " + tow(second) + "s";
        osp.innerHTML = ost;
    }
    getDate();
    setInterval(getDate,1000);

</script>

运行结果

 

推荐阅读