JavaScript编辑考研倒计时

最新推荐文章于 2023-04-28 15:48:09 发布

S.Y.X

最新推荐文章于 2023-04-28 15:48:09 发布

阅读量326

点赞数

分类专栏：成品展示

本文链接：https://blog.csdn.net/mmmmmmmmmmz/article/details/107685372

版权

成品展示专栏收录该内容

1 篇文章 0 订阅

订阅专栏

代码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        .box {
            width: 1000px;
            height: 300px;
            margin: 200px auto;
            padding-bottom: 50px;
            background: url(images/bg-1.jpg) no-repeat;
        }
        .box span {
            display: inline-block;
            width: 196px;
            height: 100px;
            color: #0ce6d3;
            font-size: 50px;
            line-height: 100px;
            text-align: center;
            /* margin: 0 50px; */
        }
        .box .dao {
            display: inline-block;
            width: 1000px;
            height: 200px;
            line-height: 200px;
        }
        .box1 {
            width: 800px;
            height: 100px;
            margin: 0 100px;
        }
    </style>
</head>

<body>
    <div class="box">
        <span class="dao">2021年考研倒计时</span>
        <div class="box1">
            <span class="day">1</span>
            <span class="hour">2</span>
            <span class="minute">3</span>
            <span class="second">4</span>
        </div>
    </div>
    <script>
        var day = document.querySelector('.day');
        var hour = document.querySelector('.hour');
        var min = document.querySelector('.minute');
        var sec = document.querySelector('.second');
        var inputTime = +new Date('2020-12-19 8:30:00'); //输入总毫秒数
        setInterval(countDown, 1000); //每隔一秒执行一次
        function countDown() {
            var nowTime = +new Date(); //当前总毫秒数
            var times = (inputTime - nowTime) / 1000; //倒计时总毫秒数
            var d = parseInt(times / 60 / 60 / 24);
            day.innerHTML = d + '天';
            var h = parseInt(times / 60 / 60 % 24);
            hour.innerHTML = h + '时';
            var m = parseInt(times / 60 % 60);
            min.innerHTML = m + '分';
            var s = parseInt(times % 60);
            sec.innerHTML = s + '秒';
            return d + '天' + h + '时' + m + '分' + s + '秒';
        }
        // console.log(countDown('2020-12-19 8:30:00'));
    </script>
</body>

</html>