倒计时

最新推荐文章于 2021-11-16 01:31:16 发布

diligentkong

最新推荐文章于 2021-11-16 01:31:16 发布

阅读量306

点赞数

分类专栏： JS实例效果

本文链接：https://blog.csdn.net/diligentkong/article/details/54892731

版权

JS实例效果专栏收录该内容

7 篇文章 0 订阅

订阅专栏

也许这是最后一个寒假，总感觉和父母在一起的时间越来越短暂，时间抓也抓不住，匆匆从指缝溜走！啥也不说了，用代码看看距离离家还有几个小时吧！

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            *{
                margin: 0;
                padding: 0;
            }
            body{
                font-size: 30px;
                text-align: center;
                color: red;
            }
        </style>
        <script type="text/javascript">
            window.onload = function(){
                var box = document.getElementById("box");
                //最终时间
                var endTime = new Date("2017/2/13 13:30:00");
                var timer = null;
                timer = setInterval(clock,1000);
                function clock(){
                    // 获取最新的时
                    var nowTime = new Date();
                    // 用（将来的时间毫秒 - 现在的毫秒）/ 1000 得到的  还剩下多少秒   要  取整 
                    var second = parseInt((endTime.getTime()-nowTime.getTime())/1000);
                     // 一小时3600 秒 
                    var d = parseInt(second / 3600 / 24);//获取天数
                    var h = parseInt(second /3600 % 24);// 获取小时
                    var m = parseInt(second / 60 %60);//获取分钟
                    var s = parseInt(second % 60);//获取秒数


                    d < 10 ? d="0" + d : d;
                    h < 10 ? h="0" + h : h;
                    m < 10 ? m="0" + m : m;
                    s < 10 ? s="0" + s : s;
                    box.innerHTML = "距离开学时间还剩："+d+"天"+h+"小时"+m+"分钟"+s+"秒";
                    if (second < 0) {
                        box.innerHTML="已经开学了哟！！！";
                        clearInterval(timer);
                    }
                }
            }
        </script>
    </head>
    <body>
        <div class="box" id="box">

        </div>
    </body>
</html>