時計を表示させたい

2022年7月5日 2022年7月10日山崎講師

山崎講師

以下のようなリアルタイムの時計をJavaScriptを使って表示します。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>clock.html/</title>
    </head>
    <body>
        <p id="Clock"></p>
        <script>
            function clock() {
                let now = new Date();
                let hour = now.getHours();
                let minute = now.getMinutes();
                let second = now.getSeconds();
                let message = "現在時刻:" + hour + ":" + minute + ":" + second;
                document.getElementById("Clock").innerHTML = message;
            }
            setInterval('clock()', 1000);
        </script>
    </body>
</html>

Webアプリケーション制作のための小ネタ集　目次に戻る