SAK 図書館
SAK 図書館
ホームページ作成 JAVA Script 編 (その五) 数値関数、日付時間関数、その他
■数値関数
Math.abs() 絶対値
Math.floor() 切り捨て
Math.round() 四捨五入
Math.random() 乱数発生
・Math オブジェクトはスタティックのため、新たなインスタンスを作成する
必要はない。早い話、いつでも使える。
Math オブジェクトには、三角関数なども含まれている。
■Math.abs() (絶対値)
【例】
i = Math.abs(-10);
|_ 数値
** i には、10 がセットされます。
■Math.floor() (切り捨て)
【例】
i = Math.floor(1.5);
|_ 数値
** i には、1 がセットされる。
■Math.round() (四捨五入)
【例】
i = Math.round(1.5);
|_ 数値
** i には、2 がセットされる。
■Math.random() (乱数発生)
【例1】
i = Math.random();
【例2】
j = Math.floor(Math.random() * 10);
** i には、0 〜 1 の範囲の乱数がセットされる。
** j には、0 〜 10 の整数がセットされる。
■window オブジェクト
・イベント
window_onload() HTML ロードイベント
・メソッド
window.alert('メッセージ') メッセージボックス表示
window.confirm('メッセージ') 確認メッセージボックス表示
■document オブジェクト
・メソッド
document.write() HTML 出力
■Date.UTC 標準時間ミリ秒
・二つの日付や時間の差を求めたりするのに使用する。
戻り値は、ミリセカンドである。
ms = Date.UTC(2001 - 1900, 11 - 1, 12, 21, 37, 0);
| | | | | |_ 秒
| | | | |_ 分
| | | |_ 時
| | |_ 日
| |_ 月 - 1
|_ 年 - 1900
■Date オブジェクト
・日付や時間を取得する。
一部の戻り値にたいして、+1900、+1 などの加算をしないと、
一般的な日付にならないので注意する。
var date = new Date();
yy = date.getYear(); // 0 = 1900 年
mm = date.getMonth(); // 0 = 1 月
dd = date.getDate();
yb = date.getDay(); // 0 = 日曜日
hh = date.getHours();
mn = date.getMinutes();
sc = date.getSeconds();
ms = date.getTime(); // ミリセカンド換算値
gm = date.getTimezoneOffset(); // GMT との差(分単位)
■setTimeout タイムアウト設定
・指定ミリセカンド後にイベント関数を呼ぶ。
時間待ちや時間監視に使用する。
timerid = setTimeout('TimeOut()', 5000);
| | |_ ミリセカンド (5 秒 = 5000)
| |_ タイムアウト後に呼ぶ関数
|_ タイマーID
・タイムアウトの設定解除は、次のようにする。
clearTimeout(timerid);
|_ タイマーID
■setInterval インターバルタイマ設定
・指定ミリセカンド毎にイベント関数を呼ぶ。
時間待ちや時間監視に使用する。
timerid = setInterval('Interval()', 5000);
| | |_ ミリセカンド (5 秒 = 5000)
| |_ インターバル毎に呼ぶ関数
|_ タイマーID
・インターバルタイマの設定解除は、次のようにする。
clearInterval(timerid);
|_ タイマーID
■onmouseover マウスイベント
・マウスが上にのるとなにかさせる。
function button1_onmouseover() {
window.button1.value="オンマウスオーバー";
}
function button1_onmouseout() {
window.button1.value="オンマウスアウト";
}
<INPUT id=button1 name=button1 type=button value=Button
LANGUAGE=javascript onmouseout="return button1_onmouseout()"
onmouseover="return button1_onmouseover()">
■location.href ロケシーョンジャンプ
・指定 URL へ移動する。
document.location.href = 'url';
■OnMouseOver、OnMouseOut マウスイメージロールオーバ
・マウスがボタン画像にのると別の画像を表示する。
このボタン例は、submit のため、画像貼り付けボタンとややこしいことに
なっている。通常は単純な <A> タグで処理できる。
・imgmax は、イメージセット数 n。
imgout[n - 1].src は、n 番目の通常画像。
imgovr[n - 1].src は、n 番目のロールオーバ画像。
<HTML>
<HEAD>
<SCRIPT LANGUAGE=javascript>
<!--
// イメージロールオーバ
var imgmax = 2;
var imgovr = new Array();
var imgout = new Array();
var i;
for (i = 0; i < imgmax; i++){
imgovr[i] = new Image();
imgout[i] = new Image();
}
i = 0;
imgout[i].src = 'image0out.gif';
imgovr[i++].src = 'image0ovr.gif';
imgout[i].src = 'image1out.gif';
imgovr[i++].src = 'image1ovr.gif';
function image_onmouseover(imgnum, imgname) {
document.images[imgname].src = imgovr[imgnum].src;
}
function image_onmouseout(imgnum, imgname) {
document.images[imgname].src = imgout[imgnum].src;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<BUTTON STYLE="BACKGROUND-COLOR: white; BORDER-STYLE: none;"
type="submit"
OnMouseOver="image_onmouseover(0, 'submit')"
OnMouseOut="image_onmouseout(0, 'submit')">
<IMG src="image0out" width="80" height="24" border="0"
name="submit">
</BUTTON>
<BUTTON STYLE="BACKGROUND-COLOR: white; BORDER-STYLE: none;"
type="reset"
OnMouseOver="image_onmouseover(1, 'reset')"
OnMouseOut="image_onmouseout(1, 'reset')">
<IMG src="image1out.gif" width="80" height="24" border="0"
name="reset">
</BUTTON>
</FORM>
</BODY>
</HTML>
■ホームページ作成 JAVA Script 編資料
■プログラミング言語資料
■企業サイト、商用サイト作成編資料
■ホームページ作成 HTML 編資料
■ホームページ作成 設計編資料
Copyright (C) 1999-2018 Y.SAK