JavaScriptをHTMLが読み込まれたら実行する/ウェブページが完全に読み込まれたら実行する

    >


DOMContentLoadedがHTML、onloadがウェブページ全体です。

JavaScriptでは、addEventListenerでイベントを指定してやります。

以下コードで検証してみればわかりますが、当然、DOMContentLoadedが先に出力されます。
というか、ウェブサイトによっては、いくら待ってもDOMContentLoadedが出力されない場合もあります。
僕のWordPressブログなんかもそうですし、Youtubeなんかもそうでした。

//# dev
document.addEventListener("load", function() {
   // 実行したい処理
   console.log('loaded.')
});

document.addEventListener("DOMContentLoaded", function() {
   // 実行したい処理
   console.log('DOMContentLoaded.')
});

なので新しいサイトで開発を始める前には、onloadは動かないものとして、もし使うなら、必ず上記コードで検証してからのほうが良いかと思います。




お困りですか?この記事で紹介していることをマンツーマンで指導、解説、代行します。まずはお気軽にお問い合わせください。


Close Menu