More than 3 years have passed since last update.

JavaScriptで現在日時を表示させてみた

JavaScript

Posted at 2020-07-13

JavaScriptで現在日時を表示するコードを書いたのでメモ程度に残しておきます。

とりあえず雛形の作成から

ターミナル

$ mkdir clock
$ cd clock
$ touch index.html

作成したhtmlファイルに以下を追記

index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>clock</title>
  </head>

  <body>
    <div id="clock"></div>
  </body>
</html>

これで雛形が完成したのでjavascriptを書いていきます。

以下のコードを<div id="clock"></div>の下に記載してください。

index.html

<script>
  timerID = setInterval('clock()', 500);

    function clock() {
      document.getElementById("clock").innerHTML = getNow();
    }
    
    function getNow() {
      var now = new Date();
      var year = now.getFullYear();
      var mon = now.getMonth() + 1;
      var day = now.getDate();
      var hour = now.getHours();
      var min = now.getMinutes();
      var sec = now.getSeconds();

      var s = year + "年" + mon + "月" + day + "日" + hour + "時" + min + "分" + sec + "秒";
      return s;
    }
</script>

これでindex.htmlを実行すると現在日時が表示できます。

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up