Dateオブジェクト

Dateオブジェクトを使用すると、指定の日時データが取れるらしい。

Dateオブジェクトのメソッドを利用して、それぞれを変数に代入したあとに、それをhtmlに表示させてみると下記の通り。

今の日時は

表示できている。が、更新しても日までしか表示できていないため、本当に現在の日時が表示されているのか、わからなかったので、秒まで表示させることにした。

今の日時は

これでおそらく秒まで表示できているので、更新すれば本当に現在日時が表示されているのかわかるはず。

しかし、またふと思った。時間を24時間制ではなくam、pmで表示させれないだろうか。ネットで検索すればすぐに見本が出てくるのだろうが、とりあえず自分で試してみることにした。

当初getHours()で取得した時間から-12を引けばいいと思ったが、1～12時までの時間はマイナスになってしまうし、そもそもam/pmを付けられない・・・。ということは、if文で条件分岐するしかないのかと思いやってみた。

if文で13～24時の際は時間を収めた変数から12を引いて代入し直して…。なぜかエラー。よく見ると、これまでconstで時間を代入する変数を宣言していたのので、変数の宣言をletに変更。あとは適当に表示の仕方を変えて…。少し脱線するが、10年以上前にJavaScriptを少しかじった際には、変数の宣言はvarを用いていたけれど、調べてみるとどうもそれは古いらしい。

今の日時は

うまくいった。本当はリアルタイムで時間が更新されるようにしたいが、まだ自分にはその知識がないので、とりあえず今回はこれまで。やり方がわかるようになったら、もう一度戻ってこよう。