javascript 简单时分秒倒计时 

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .time_box {
            width: 200px;
            height: 50px;
            margin: 50px auto;
        }

        .time_box div {
            float: left;
            width: 30px;
            height: 30px;
            margin: 0 2px;
            background-color: #999;
            color: white;
            text-align: center;
            line-height: 30px;
            font-size: 20px;
        }
    </style>
</head>
<body>
<div class="time_box">

    <div class="hour"></div>
    <div class="minute"></div>
    <div class="second"></div>

</div>
<script>
    var h = document.querySelector('.hour');
    var m = document.querySelector('.minute');
    var s = document.querySelector('.second');
    var date1 = +new Date('2019-9-24 18:00:00'); // 这里设置结束 时间

    function cutTime() {
        var date = +new Date();   // 这里设置开始 时间
        var times = (date1 - date) / 1000;
        var hour = parseInt(times / 60 / 60 % 24);  // 这里是小时数
        hour = hour < 10 ? '0' + hour : hour;
        h.innerHTML = hour;   // 将小时数 添加到小时盒子内
        var minute = parseInt(times / 60 % 60);  // 这里是分钟数
        minute = minute < 10 ? '0' + minute : minute;
        m.innerHTML = minute; // 将分钟数 添加到分钟盒子内
        var second = parseInt(times % 60);  // 这里是秒数
        second = second < 10 ? '0' + second : second;
        s.innerHTML = second; // 将秒数 添加到秒数盒子内
    }

    cutTime();

    setInterval(cutTime, 1000);
</script>


</body>
</html>

 

posted @ 2019-04-24 21:51  码小龙  阅读(315)  评论(0)    收藏  举报