New Year's Day Countdown

Code (copy can modify the time you want to count down):
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        span{
            display: inline-block;
            width: 30px;
            height: 30px;
            /* border: 1px solid red; */
            font-size: 24px;
            vertical-align: middle;
            background-color: black;
        }
        .maxbox{
            width: 250px;
            height: 411px;
            margin: 0 auto;
            background-image: url(./img/1.webp);
            background-size: 250px 411px;
            color: white;
            position: relative;

        }
        .smallbox{
            width: 138px;
            height: 65px;
            /* border: 1px solid red; */
            position: absolute;
            top: 190px;
            /* transform: translateY(-50%); */
            left: 70px;
            /* transform: translatex(-50%); */
        }
    </style>
</head>
<body>
    <div class="maxbox">
        <div class="smallbox">
            <div class="box">距离元旦还有：</div>
            <span id="shi"></span>
            :
            <span id="fen"></span>
            :
            <span id="miao1"></span>
        </div>
    </div>
    <script>
        var shi = document.getElementById("shi");
        var fen = document.getElementById("fen");
        var maio = document.getElementById("maio1");
        function daojishi() {
            var olddate = new Date();
            var yuandan = new Date("2022 / 1 / 1 ");
            yuandan.setHours(0, 0)
            var num = yuandan.getTime() - olddate.getTime();
            // 获取小时数
            xiaoshi = Math.floor((num % (86400 * 1000)) / 3600 / 1000)
            console.log(xiaoshi);
            xiaoshi = xiaoshi < 10 ? '0' + xiaoshi : xiaoshi;
            // 获取分钟数
            fenzhong = Math.floor((num % (86400 * 1000 * 3600)) / 60 / 1000) % 60
            console.log(fenzhong);
            fenzhong = fenzhong < 10 ? '0' + fenzhong : fenzhong;
            // 获取秒
            miao = Math.floor(num / 1000) % 60
            console.log(miao);
            miao = miao < 10 ? '0' + miao : miao;
            //给i为shi的sapn添加定时小时内容
            shi.innerHTML = `${xiaoshi}`
            fen.innerHTML = `${fenzhong}`
            miao1.innerHTML = `${miao}`
        }
        setInterval(daojishi, 1000)

    </script>
</body>
</html>
New Year's Day Countdown

Guess you like
