今日の日付と現在時刻JavaScript入門

  1. HOME
  2. JavaScript入門
  3. 今日の日付と現在時刻

ここからJavaScriptで日付と時間を扱う方法について解説していきます。 まず最初は、今日の日付と現在時刻を取得する方法について説明します。

今日の日付を取得する

まずはHTMLのBODY内に以下のコードを記入してみてください。

<script>

//今日の日付データを変数hidukeに格納
var hiduke=new Date(); 

//年・月・日・曜日を取得する
var year = hiduke.getFullYear();
var month = hiduke.getMonth()+1;
var week = hiduke.getDay();
var day = hiduke.getDate();

var yobi= new Array("日","月","火","水","木","金","土");

document.write("西暦"+year+"年"+month+"月"+day+"日 "+yobi[week]+"曜日");

</script>

スクリプトの結果=

今日の日付データを取得する

上記スクリプトについて見ていきましょう。 最初に変数hidukeに今日の日付データ一式を取得して格納します。 取得方法はnew Date()を用います。

new Date()
現在の日付&時刻を取得します。

年・月・日・曜日を求める

次に、日付データの中から年・月・日・曜日をそれぞれ抜き出します。 月と曜日はそれぞれちょっと加工が必要な形で抜き出されます。

日付.getFullYear()
4桁の西暦年を取得します。
日付.getMonth()
月を取得します。値は実際より1つ少ない数になります。
日付.getDay()
曜日を取得します。日曜日が0で、月曜が1,…,土曜が6となります。
日付.getDate()
日にちを取得します。

月は1つ少なく取得されるので、+1とします。 曜日は数字の形で表されるので、 文字の形で順に配列yobiに代入しておきます。 最後にdocument.write()で全ての要素を書き出しています。

(このnew Date()で作成された日付データ一式を正式には日付オブジェクトと呼びます)。

現在時刻を取得する

HTMLのBODY内に以下のスクリプトを記入してみましょう。

<script>

//時刻データを取得して変数jikanに格納する
var jikan= new Date();

//時・分・秒を取得する
var hour = jikan.getHours();
var minute = jikan.getMinutes();
var second = jikan.getSeconds();

document.write(hour+"時",+minute+"分"+second+"秒");

</script>

サンプルの結果=

時刻データを取得する

今度は現在時刻を求めていますが、実はnew Date()で時刻も取得できます。 時刻データ一式を変数jikanに格納しています。

時・分・秒を取得する

今度は時刻データからそれぞれ時・分・秒を抜き出します。

時刻.getHours()
時刻データの中から時間を取得します。
時刻.getMinutes()
時刻データの中から分を取得します。
時刻.getSeconds()
時刻データの中から秒を取得します。

最後にdocument.write()で書き出しています。

今回取得された日付や時刻は、PCで設定されているものです。 ですからパソコンの日付設定などが狂っていると、 正しいデータが取得できないということを覚えておいて下さい。

楽天booksのJavaScript解説本 JavaScriptワークブック第3版 JavaScript基礎入門 プログラミングTypeScript 作りながら学ぶWebプログラミング実践入門 新しいJavaScriptの教科書 子どもから大人までスラスラ読めるJavaScriptふりがなKidsプログラミン 30時間アカデミック JavaScript入門 確かな力が身につくJavaScript「超」入門 第2版 いちばんやさしいJavaScriptの教本第2版 HTML&CSS JavaScriptプログラミング基礎演習ワークブック

Supported by Rakuten Developers