onload/JavaScript

イベントハンドラのonloadについて説明します。

onloadの使い方

　onloadは、ページ読み込みが完了した時に処理を実行出来ます。

　以下は、例です。

【onload利用例】

<body onload="alert('テストです');">

　<body>タグを上記のように書き換えると、ページが表示された時にアラートが表示されます。ページをリロードした時も同じです。

　ページ読み込み時にスクロールさせる例です。

【ページ読み込み時にスクロールさせる例】

<html>
<head>
・・・
</head>

<body onload="window.scrollTo(0,100);">
・・・
</body>
</html>

　window.scrollToは横、縦のスクロール量をpxで指定します。このため、上記はページが100px下にスクロールして表示されます。

　以下のように、画像読み込み時に処理を実行させる事も出来ます。

【画像読み込み時に処理を実行させる例】

<img src="test.png" alt="テスト画像" onload="alert('テストです');"/>

　iframeで別ファイルを読み込む時も、同様に使えます。

・サポートするブラウザ

　以下は、最新バージョンでのサポート状況を示していますが、Internet ExplorerはOSによって使えるバージョンが異なるため、使えるバージョンを示しています。WindowsXPで使えるInternet Explorer8以降、全てのバージョンで使える場合は〇とします。

・サポートするタグ

　サポートするタグの一例は、以下の通りです。

　<body>

　<image>