Chrome拡張機能のJS - 要素がDOMに入るたびに関数を実行

Question

Chrome拡張機能の記述。

特定のタイプの要素はDOMに入ると、私はJSがかかるその要素に対して関数をこれを認識し、実行することができるようにしたい（クラス.text-specialまたはタグ<span>の種類、またはID #searchResultなどすることができます）要素自体を引数とします。

「私にこの他の要素の子要素のみを渡してください」と言いますが、それでも同じ問題です。

これは可能ですか？

Answer 1

あなたが親にイベントを配置し、クリックがあなたの子供になされたことを確認する必要がありhttps://hacks.mozilla.org/2012/05/dom-mutationobserver-reacting-to-dom-changes-without-killing-browser-performance/

Answer 2

要素が追加されているかどうかをほぼ連続して確認できますが、十分短い間隔を選択してIIFEでクロム拡張子を囲むことができます。

var frequency = null; 

    var readyStateFrequency = setInterval(function() { 

     if (document.readyState === "interactive" || document.readyState === "complete") { 

      clearInterval(readyStateFrequency); 

      frequency = setInterval(function() { 
       app.executeMe(); 
      }, 10); 
     } 
    }, 10); 

    var app; if (!app) app = {}; 

    (function(callback) { 

     var app = { 

      executeMe : function(){ 

          clearInterval(frequency); 

          // check if the DOM element exists(using selector query) and if found perform required logic 
          //this.doSomething(); 
      } 
     }; 

    window.app = app; 

    }(window)); 

Answer 3

MutationObserverを試みることができる何

document.getElementById("parent").onclick=function(e){ 
 
    if(e.target.className=="child"){ 
 
    console.log(e.target); 
 
    } 
 
}; 
 
//test 
 
document.getElementById("add").onclick=function(){ 
 
    document.getElementById("parent").innerHTML+='<div class="child">123</div>'; 
 
};

<div id="parent"><div class="child">abc</div></div> 
 
<button id="add">add</button>