调用详细时间API HTML前端代码-顺成小栈

调用详细时间API HTML前端代码
API调用服务由顺城免费API提供
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>调用详细时间API代码</title>
    <style>
        body {
            font-family: 'Arial', sans-serif;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            background-color: #f7f7f7;
        }
        .container {
            background: #fff;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
            width: 300px;
            text-align: center;
        }
        h1 {
            color: #333;
        }
        .time-info {
            font-size: 24px;
            margin: 20px 0;
            color: #4a4a4a;
        }
        .remark {
            font-size: 14px;
            color: #888;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>调用详细时间API代码</h1>
        <div class="time-info" id="dateInfo"></div>
        <div class="time-info" id="weekdayInfo"></div>
        <div class="time-info" id="timestampInfo"></div>
        <div class="time-info" id="currentTime"></div>
        <div class="remark">
            该代码由顺城免费API提供API调用服务
        </div>
    </div>

    <script>
        function updateTime() {
            var now = new Date();
            var dateInfo = now.getFullYear() + '-' +
                           ('0' + (now.getMonth() + 1)).slice(-2) + '-' +
                           ('0' + now.getDate()).slice(-2) + ' ' +
                           ('0' + now.getHours()).slice(-2) + ':' +
                           ('0' + now.getMinutes()).slice(-2) + ':' +
                           ('0' + now.getSeconds()).slice(-2);
            var weekdayInfo = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'][now.getDay()];
            var timestampInfo = now.getTime();

            document.getElementById('dateInfo').textContent = dateInfo;
            document.getElementById('weekdayInfo').textContent = '星期: ' + weekdayInfo;
            document.getElementById('timestampInfo').textContent = '时间戳: ' + timestampInfo;
            document.getElementById('currentTime').textContent = '实时时间: ' + now.toLocaleTimeString();
        }

        // 每1000毫秒（1秒）更新一次时间
        setInterval(updateTime, 1000);

        // 页面加载完成后立即更新时间
        updateTime();
    </script>
</body>
</html>
文章版权归作者所有，未经允许请勿转载。
THE END