特定のタイプの要素がDOMに追加されるようにトリガーするイベントリスナーを追加するにはどうすればよいですか？

Question

新しいiframeが現在のウィンドウに作成されるたびに、特定のメソッドを呼び出す必要があります。 youtube iframe player私はそれが現在のウィンドウで作成されたり有効になったりするたびに新しいiframeを聞く必要があります。そんなことをすることは可能ですか？何らかの方法があるかどうか教えてください。以下のコードを試しましたが、このコードは動的に作成された新しいiframeを検出しません。私はグーグルで試みたが、あなたはMutationObserverを使用することができます任意の情報

const iframes = document.getElementsByTagName('iframe'); 
    forEach(iframes, (iframe) => { 
     addEventListeners(iframe); 

     } 
    } 
    }); 

Answer 1

を取得できませんでした。これは、DOMへの突然変異を聞くことができます。そのあなたがDOM自体にイベントリスナーを設定し、とiframeがそれに追加されるたびにために聞いているような：ここでは

(new MutationObserver(mutations => { 
    mutations[0].addedNodes.forEach(node => { 
     if (node.tagName.toLowerCase() === 'iframe') { 
      //do stuff 
     } 
    }); 
})).observe(document.body, {childList: true}); 

我々はdocument.bodyを聞いている、と我々は唯一の（その子ノードへの変更のために聞いていますノードが追加または削除されます）。 forEachは、追加された各ノード（存在する場合）を通過し、そのノードがiFrameかどうかを確認します。そうであれば、 "do stuff"の行で何をする必要があるかを実行します。