条件によりページの内容を変える

時刻やランダムにページの文や画像を変えます。JavaScrptを使用します。

記入例(開く時間によって文または表示画像を変える)
<script lunguarge="JavaScript">
<!--
var H = new Date;
var l_num;
var u_list = new Array("お疲れ様です","こんばんは","こんにちは","おはようございます");
if ((H.getHours() >= 23) || (H.getHours() <= 4)){l_num=0;}
if ((H.getHours() >= 5) && (H.getHours() <= 10)){l_num=3;}
if ((H.getHours() >= 11) && (H.getHours() <= 18)){l_num=2;}
if ((H.getHours() >= 19) && (H.getHours() <= 22)){l_num=1;}
document.write(u_list[l_num]);
//-->
</script>
<noscript>ようこそ</noscript>

表示結果

※この記入例では朝5時から10時台にページを開くと「おはようございます」11時から6時台だと「こんにちは」夜7時から10時台だと「こんばんは」夜11時から翌朝4時台には「お疲れ様です」とメッセージを変えて表示します。実際には表示したい場所に記入例のスクリプトを挿入して使用してください。またスクリプトを無効にしていたりスクリプトに対応していないブラウザで見たときにはNOSCRIPTタグ内が表示されます。スクリプト中のメッセージをタグに変更すれば、画像や書式を変えたりすることも可能です。

記入例(ランダムに変える場合)
<script lunguarge="JavaScript">
<!--
var u_list = new Array('<a href="index.htm">ホーム</a>','<a href="mailto:aaj49490@pop21.odn.ne.jp">メール</a>','<a href="waza012.htm">このページ</a>');←要素を増やす場合は,で区切り、'で囲みます。
var num = 3;←要素数です。上の要素を増やしたらこの値も変えます。
var l_num = Math.round(Math.random()*(num-0.01)-0.5);
document.write(u_list[l_num]);
//-->
</script>
<noscript><a href="index.htm">ホーム</a> <a href="mailto:aaj49490@pop21.odn.ne.jp">メール</a> <a href="waza012.htm">このページ</a></noscript>

表示結果

※ランダムに変える場合の記入例です。Aタグを利用してランダムにリンク先を変えています。タグの場合ダブルクォーテーション→"をタグ中に使用するので、それぞれをシングルクォーテーション→'で囲んでいます。

スクリプトを用いて動的にページを変える仕掛けを施す場合は、スクリプトの実行を無効にしている人やスクリプトに対応していないブラウザの人のことも考える必要があります。NOSCRIPTタグの記述を忘れずに!

ホームページ作成の知恵袋

Copyright(C) ホームページ作成の知恵袋 All rights reserved.