【Html】タグが読み込まれたことを検出(onloadを使用せず)

Sponsored Links

画面の読み込みが完了したことをトリガーにjavascriptのロジックを走らせるときは、onloadや、jqueryでは$(document).readyなどが使用できる。
Single Page Application (SPA)では、画面遷移時では画面の一部のDOMが更新されるだけ(ページ全体が再読み込みされない)で、onload、raedyなどのファンクションが使用できない。
この時に、DOMの変更を監視することができる機能(MutationObserver)がある。
これを使用し、画面の内容が変わったので、このscriptを実行する のような動きを行うことができる。
こちらがオリジナル記事
MutationObserverの説明はこちら

//オブサーバーを定義
var observer = new MutationObserver(function() {
  var elm = document.getElementById("監視するIDを指定");
  if (elm) {
        // このなかでonload、readyファンクションで行おうとしていること記載する
        // これ以上監視を続けない場合は、observer.disconnect()する
  }
});
//監視開始
observer.observe(document, {childList: true, subtree: true});


IT
Sponsored Links
Sponsored Links
Sponsored Links
ようさんチョットでぶ
Copied title and URL
Bitnami