Js显示系统当前时间_js按如下格式显示系统日期-优快云博客

本文链接：https://blog.youkuaiyun.com/mm5720181520/article/details/128405930

<!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>当前时间</title>
    <style type="text/css">
        body{
            margin:0;
            padding:0;
            background-color: rgb(243, 252, 255);
            padding-top: 250px;
        }
        .time {
            width: 400px;
            box-shadow:5px 5px 20px rgb(228, 254, 255) inset;
            border-radius: 10px;
            padding: 10px;
            background-color: azure;
            align-items: center;
            margin:auto;
        }
        .time span {
            display: inline-block;
            width: auto;
            height: 20px;
            text-align: center;
        }
        .bgd {
            border-radius: 2px;
            /* background-color: rgb(238, 238, 255); */
            width: fit-content;
            margin :auto;
            font-size: 20px;
            font-family: 'Courier New', Courier, monospace;
        }
    </style>
</head>

<body>

    <div class="time"><h1>当前时间：</h1>
        <hr>
        <div class="bgd">
            <span id="y"></span>年
            <span id="mo"></span>月
            <span id="d"></span>日
            <span id="h"></span>时
            <span id="m"></span>分
            <span id="s"></span>秒
        </div>
    </div>

</body>
<script>
    (function show() {
        var now = new Date();
        var year = now.getFullYear(); //得到年份
        var month = now.getMonth() + 1;//得到月份
        var date = now.getDate();//得到日期
        // var day = now.getDay();//得到周几
        var hour = now.getHours();//得到小时数
        var minute = now.getMinutes();//得到分钟数
        var second = now.getSeconds();//得到秒数
        debugger;
        document.getElementById("y").innerHTML = year;
        document.getElementById("mo").innerHTML = month;
        document.getElementById("d").innerHTML = date;
        document.getElementById("h").innerHTML = hour;
        document.getElementById("m").innerHTML = minute;
        document.getElementById("s").innerHTML = second;
        setTimeout(show, 1000);//定时器一直调用show()函数
        return "";
    })();

</script>

</html>