Javascriptは、ブラウザの種類やバージョン、環境により機能するものとしないものがあります。
また、DHTMLを使用している場合もあります。
※DHTMLについては「DHTMLサンプル」もご参照下さい。
■ 現在時刻の表示
現在の時刻を取得するにはJavaScriptのnew Date()関数を使用します。
その後、その変数から「年、月、日、時、分、秒」をそれぞれ取得します。
時差の取得には、その変数に秒単位の数値を加減算します。
なお、表示方法はいろんな方法がありますが、今回はフォームのテキスト入力を使用しました。
◆ 実行サンプル
| 略号の説明 | 動作が確認できたブラウザ |
|---|---|
| IE6.0 NS7.0 MZ1.7.7 FF1.5 OP7.53 |
- 【記述サンプル】
-
まず、テキストエディタなどを使用し、次の記述を「ontim01.js」というファイル名で保存します。
tim_dsp(); function tim_dsp(){ stance = 8*60*60*1000; //8時間の時差 yobi = new Array("日","月","火","水","木","金","土") //現在の時刻の取得＆表示 gtim0 = new Date(); mn0 = gtim0.getMonth() + 1; txt0 = ""; txt0 = txt0 + gtim0.getFullYear() + "年"; txt0 = txt0 + mn0 + "月"; txt0 = txt0 + gtim0.getDate() + "日"; txt0 = txt0 + "(" + yobi[gtim0.getDay()] + ")"; txt0 = txt0 + gtim0.getHours() + "時"; txt0 = txt0 + gtim0.getMinutes() + "分"; txt0 = txt0 + gtim0.getSeconds() + "秒"; document.frm1['tim0'].value = txt0; //8時間前の時刻の取得＆表示 gtim0 = new Date(); gtim0.setTime(gtim0.getTime() - stance); mn0 = gtim0.getMonth() + 1; txt0 = ""; txt0 = txt0 + gtim0.getFullYear() + "年"; txt0 = txt0 + mn0 + "月"; txt0 = txt0 + gtim0.getDate() + "日"; txt0 = txt0 + "(" + yobi[gtim0.getDay()] + ")"; txt0 = txt0 + gtim0.getHours() + "時"; txt0 = txt0 + gtim0.getMinutes() + "分"; txt0 = txt0 + gtim0.getSeconds() + "秒"; document.frm1['tim1'].value = txt0; //8時間後の時刻の取得＆表示 gtim0 = new Date(); gtim0.setTime(gtim0.getTime() + stance); mn0 = gtim0.getMonth() + 1; txt0 = ""; txt0 = txt0 + gtim0.getFullYear() + "年"; txt0 = txt0 + mn0 + "月"; txt0 = txt0 + gtim0.getDate() + "日"; txt0 = txt0 + "(" + yobi[gtim0.getDay()] + ")"; txt0 = txt0 + gtim0.getHours() + "時"; txt0 = txt0 + gtim0.getMinutes() + "分"; txt0 = txt0 + gtim0.getSeconds() + "秒"; document.frm1['tim2'].value = txt0; }
8時間前の時刻を取得したいときは、次のようにして求めます。 stance = 8*60*60*1000; //8時間の時差 gtim0 = new Date(); gtim0.setTime(gtim0.getTime() - stance); のように変更します。
そして、現在時刻などを表示する入力フォームとJavascriptを次のように記述します。 <form name="frm1">
現在の時刻 <input type="text" size="40" style="text-align:center;" name="tim0"><br>
時差の時刻 <input type="text" size="40" style="text-align:center;" name="tim1">（8時間前）<br>
時差の時刻 <input type="text" size="40" style="text-align:center;" name="tim2">（8時間後）<br>
</form>
<script type="text/javascript" src="ontim01.js"></script>