动态显示时间 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>

        .time {
            font-size: 30px;
            color: orangered;
            background-color: yellow;
            width: 300px;
            font-style: italic;
            padding: 10px;
            text-align: center;
        }

    </style>
</head>
<body>
    <div class="time">2025-01-08 00:00:00</div>
    <script>
        var timeEl = document.querySelector('.time')
        function leftFillo(num, len) {
            return num.toString().padStart(len, '0')
        }
        
        setInterval(function () {
            var date = new Date()
            var year = date.getFullYear()
            var month = leftFillo(date.getMonth() + 1, 2)
            var day = leftFillo(date.getDate(), 2)
            var hour = leftFillo(date.getHours(), 2)
            var minute = leftFillo(date.getMinutes(), 2)
            var second = leftFillo(date.getSeconds(), 2)
            var time = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second
            // console.log(time)
            timeEl.textContent = time
        }, 1000)

    </script>

</body>
</html>
posted @ 2025-01-09 08:34  魏阳晨  阅读(6)  评论(0)    收藏  举报
AmazingCounters.com