JavaScript プログラミング
前へ 目次へ 次へ 

　５．時間の処理

　現在日時（コンピュータの時計）を取得するには次のようにした（「3.関数の作成」参照）。

dd = new Date();  //日付(Date)のオブジェクト作成
document.rei3b.day.value = dd.toLocaleString();  //現在日時の設定

　日付のオブジェクトddに対して toLocaleStringメソッドを実行すると「2003年5月5日 12:34:56」のように日付と時間を取り出すことができる。次に、必要なデータだけ、例えば日付だけ取り出してみよう。


(1) 日付を取り出す
　現在の日付を取り出すには、日付のオブジェクトに対して次のメソッドを実行する。

西暦年 getYear 西暦年から1900を減じた値。
2000年以降はそのまま4けたの値になるバージョンもある。
月 getMonth 現在の月から1を減じた値。
日 getDate 現在の日。

　フォームを1つ用意し、入力部品を配置（左図参照）する。
　フォームはname="rei7"とする。
　・1行テキスト　…　size="20" type="text" name="today"

HTMLリスト　[[jsrei7.html]]

<HTML>
<HEAD>
<TITLE>現在の日付</TITLE>
</HEAD>
<BODY onload="document.rei7.today.value=gettoday();">
<SCRIPT language="JavaScript">
<!--
function gettoday(){
    ymd = new Date();    //日付(Date)のオブジェクト作成
    yy = ymd.getYear() % 1900 + 1900;    //年
    mm = ymd.getMonth() + 1;    //月
    dd = ymd.getDate();    //日
    return yy + "年" + mm + "月" + dd + "日";    //yyyy年mm月dd日
}
//-->
</SCRIPT>
<FORM name="rei7">現在の日付 <INPUT size="20" type="text" name="today"></FORM>
</BODY>
</HTML>

　イベントとそのアクションは<BODY>タグに書いている。イベントはonloadでページが読み込まれたときに発生（実行）する。
　年を取り出す行では、ymd.getYear() % 1900としている。% は余りを求める演算子である。バージョンによって、2000年が1900を減じて100と取り出せたり、2000そのまま取り出せたりすることがあるので、それに対処している。

問題　年を和暦(平成)で表示しなさい。
　ヒント　西暦から1988を減じると平成年になる。


HTMLリスト


(2) 曜日を取り出す（配列）
　曜日は日付のオブジェクトに対してgetDayメソッドを実行する。返却値は日曜日が0、月曜日が1、・・・、土曜日が6となる。
　各曜日の返却値を配列の添字に対応させて、曜日の文字を記憶させておくと簡単に処理できる。

曜日 getDay 返却値 0 1 2 3 4 5 6
配列a a[0] a[1] a[2] a[3] a[4] a[5] a[6]
曜日 日 月 火 水 木 金 土

　配列の作り方
　配列はArrayオブジェクトを使って用意する。

方法1 
  aa = new Array();
  aa[0] = "日";
  aa[1] = "月";
  aa[2] = "火";
  aa[3] = "水";
  aa[4] = "木";
  aa[5] = "金";
  aa[6] = "土";
方法2 
  aa = new Array("日","月","火","水","木","金","土");

HTMLリスト　[[jsrei7b.html]]

<HTML>
<HEAD>
<TITLE>現在の日付</TITLE>
</HEAD>
<BODY onload="document.rei7.today.value=gettoday();">
<SCRIPT language="JavaScript">
<!--
function gettoday(){
    ymd = new Date();
    aa = new Array("(日)","(月)","(火)","(水)","(木)","(金)","(土)");
    yy = ymd.getYear() % 1900 + 1900;
    mm = ymd.getMonth() + 1;
    dd = ymd.getDate();
    return "平成" + (yy-1988) + "年" + mm + "月" + dd + "日" + aa[ymd.getDay()];
}
//-->
</SCRIPT>
<FORM name="rei7">現在の日付 <INPUT size="25" type="text" name="today"></FORM>
</BODY>
</HTML>


(3) 時間を取り出す
　現在の時刻を取り出すには、日付のオブジェクトに対して次のメソッドを実行する。

時間 getHours 0〜23の値。　24時間制。
分 getMinutes 0〜59の値。
秒 getSeconds 0〜59の値。
ミリ秒 getMilliseconds 0〜999の値。

　フォームを1つ用意し、次の入力部品を配置（下図参照）する。フォームはname="rei7"とする。
　・1行テキスト　…　size="20" type="text" name="today"
　・1行テキスト　…　size="20" type="text" name="now"　←　追加

HTMLリスト　[[jsrei7c.html]]

<HTML>
<HEAD>
<TITLE>現在の日付・時間</TITLE>
</HEAD>
<BODY onload="document.rei7.today.value=gettoday(); document.rei7.now.value=getnow();">
<SCRIPT language="JavaScript">
<!--
function gettoday(){
    ymd = new Date();
    aa = new Array("(日)","(月)","(火)","(水)","(木)","(金)","(土)");
    yy = ymd.getYear() % 1900 + 1900;
    mm = ymd.getMonth() + 1;
    dd = ymd.getDate();
    return "平成" + (yy-1988) + "年" + mm + "月" + dd + "日" + aa[ymd.getDay()];
}
function getnow(){
    hms = new Date();
    hh = hms.getHours();
    mm = hms.getMinutes();
    ss = hms.getSeconds();
    return hh + "時" + mm + "分" + ss + "秒";
}
//-->
</SCRIPT>
<FORM name="rei7">現在の日付 <INPUT size="25" type="text" name="today">
現在の時刻 <INPUT size="20" type="text" name="now"></FORM>
</BODY>
</HTML>

　現在の時間はページが読み込まれたときの時間であり、変わることはない。普通の時計のように、常に時間を表示するようにするにはタイマーを使う。


前へ 目次へ 次へ 
 JavaScript プログラミング Copyright © 2003 Hiroshi Masuda 

 

 

inserted by FC2 system