文字を現在時刻に合わせて表示する


動作ブラウザ 【 IE:3.0  NN:2.0
Internet Explorer Netscape Navigator DreamPassport iCab
3.0x 4.0x 4.5 5.0x 5.5 2.0x 3.0x 4.0x 4.x 6.0 2 3 2.x
Windows - - -
Macintosh - - -
UNIX - - - - - - - -
Dreamcast - - - - - - - - - - -

ポイント h = (new Date()).getHours(); if ((h >= 6) && (h <12)) document.write("午前中");
説  明 文字を時間ごとに変えるには(new Date()).getHours()で時間を取得しif命令で時間を調べます。document.write()で表示するメッセージを出力します。複合条件を指定するには&&を使います。&&は左辺と右辺の条件式がtrueの場合にtrueとなります。どちらかが条件を満たせずfalseであれば&&の結果はfalseとなります。
サンプル <html> <head> <title>文字を現在時刻に合わせて表示する</title> </head> <body> <script Language="JavaScript"><!-- h = (new Date()).getHours(); if ( h < 6) document.write("外は暗いですね"); if ((h >= 6) && (h <12)) document.write("午前中"); if ((h >= 12) && (h <20)) document.write("午後です"); if ( h >= 20) document.write("夜です"); // --></script> </body> </html>
補足説明 表示するメッセージを、より細かい時間別にするにはifを羅列することになってしまいます。が、実際はifを羅列することはせずに配列やselectを使って処理を行います。配列を使った例は「現在の時刻により表示する画像を変える」を参照してください。

■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!

写真素材 PIXTA