更改頁面上的運行腳本

Question

我製作了一個簡單的擴展程序，可在頁面加載時運行內容腳本。它改變了img標籤的src屬性。每當網站獲得新的img標籤時，如何讓它運行？例如，如果您在Facebook上向下滾動新內容，我想將這些新圖像更改爲我自己的圖像。也許有更好的方法？提前致謝。

Answer 1

我會創建一個mutation observer並將其添加到頁面加載後注入的內容腳本中。

下面的代碼正在監聽的圖像被添加到主體元件，和一個觸發事件的每個第二模擬的圖像被添加到DOM

// select the target node 
var target = document.querySelector('body'); 

// create an observer instance 
var observer = new MutationObserver(function(mutations) { 
    mutations.forEach(function(mutation) { 
     var nodes = mutation.addedNodes; 
     var node; 
     for(var n = 0; node = nodes[n], n < nodes.length; n++) { 
      if(node.tagName == "IMG") { 
      console.log("Image found"); 
      } 
     }; 
    }); 
}); 

// configuration of the observer: 
var config = { attributes: false, childList: true, subtree: true, characterData: false }; 

// pass in the target node, as well as the observer options 
observer.observe(target, config); 


setInterval(function() { 
    var i = new Image(); 

    document.body.appendChild(i); 

}, 1000);