JavaScript① 時刻表示

JavaScriptを用いて現在時刻を表示するWebページを作っていきます。今月読了した吉岡直人ほか『非エンジニアのためのプログラミング講座』(リックテレコム、2015年)を参考にしました。

非エンジニアのためのプログラミング講座

1.現在時刻を表示する

まずは、組込み関数「Date.now」を使ってコードを書いていきます。こちらのコードでWebページを表示すると・・・

一応数字自体は表示されましたが、これでは何が何やら分からないためより時計らしく見えるために加工を施します。

2.今は西暦何年？

今度は、関数「getFullYear」を用いてコードを書いていきます。これを元にWebページを表示させると・・・

きちんと今年の西暦が表示されました。この要領で、日付も分かるようにコードを書き加えます。

3.今は西暦何年何月何日？

関数「getMonth」と「getDate」を書き加え、Webページを表示させます。

現在の西暦に加え日付も表示されるようになりました。そして最後に、時間も見えるようコードを書き加えます。

4.現在の年月日と時刻は？

同様に関数「getHours」、「getMinutes」、「getSeconds」を加え、これらを表示するコードを完成させます。これをWebページにて表示させると・・・

最初の段階とは打って変わって、普段見慣れた現在時刻が表示されるようになりました。

次の記事では、じゃんけんゲーム作りに挑戦します。