JavaScriptのonloadイベントの使い方

onload は、HTML などのドキュメントを処理するときに使用されるイベントで、ページとすべての画像やその他のリソースが読み込まれた直後に発生します。この記事では、onload の使い方を詳しく紹介します。 JavaScriptのonloadイベントの使い方のonloadイベントの使い方のonloadイベントの使い方メソッドのイベント。

まずは onload イベント

obj.onload = function() {
// 加载完成后需要立即处理的事件
}

の基本的な書き方を見てみましょう。obj の場合、次のようになります。 window または HTML の body、img およびその他の要素として指定されます。

具体的な例を見てみましょう

ページ読み込み時に実行されます

次のコードを実行するとウィンドウを読むことができますオブジェクトの処理

window.onload = function() {
  alert("页面已加载！");
};

実行時の効果は次のとおりです

次のコードは同じ効果を実現します

function load() {
  alert("页面已加载！");
}
window.onload = load;

読み込み時に実行します画像

コードは次のとおりです

var img = new Image();
img.onload = function() {
  alert("图像已加载！");
};
img.src = 'img/mouse.png';

操作の効果は次のとおりです

##最後に、

onload イベントを使用する場合の注意事項を参照してください。

onload を使用したイベントのハンドラーは、同じ要素の同じイベントに対して複数のイベント ハンドラーを設定することはできません。同じ要素の同じイベントの場合は、 addEventListener を使用できます。

また、ページと全リソース(画像など)を読み込んだ後すぐに処理を実行したい場合はonloadを使用しますが、読み込みを待たずに処理を実行したい場合はDOMContentLoadedを使用する必要があります。 。

以上がJavaScriptのonloadイベントの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。