【8/27まで】Udemyの人気コースが今なら1,200円から!!

【JavaScript入門】ページ読み込み時にJavascriptを実行する方法

【JavaScript入門】ページ読み込み時にJavascriptを実行する方法

DOMContentLoadedイベント

DOMContentLoadedイベント
DOMContentLoadedイベントは、ページのロードが完了したタイミングで発火するイベントです。画像のロードは待ちません。
イベントリスナーでのみ使えます。

js

window.addEventListener('DOMContentLoaded', function(){
    console.log("DOMContentLoadedです!");
});

loadイベント

loadイベント
loadイベントは、DOMや画像を含むページ全体の読み込みが完了した場合に発火するイベントです。
ブラウザの「戻る」などキャッシュから読み込まれた場合は発火しません。
イベントハンドラで定義する場合は以下のように記述します。

js

window.onload = function() {
    console.log("loadイベントハンドラから呼び出されました!");
};

イベントリスナとして定義する場合は以下のように記述します。

js

window.addEventListener("load",function(){
    console.log("イベントリスナからloadイベントが呼び出されました!");
});

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です