码迷,mamicode.com
首页 > 编程语言 > 详细

javascript 简单时分秒倒计时

时间:2019-04-24 22:09:10      阅读:169      评论:0      收藏:0      [点我收藏+]

标签:UNC   utf-8   开始   width   class   cond   计时   bsp   round   

<!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>

 

javascript 简单时分秒倒计时

标签:UNC   utf-8   开始   width   class   cond   计时   bsp   round   

原文地址:https://www.cnblogs.com/nigori/p/10765215.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!