使用userscript記錄網頁的動態創建的DOM元素

Question

我想使用userscript從網頁中提取所有動態javascript函數。

有人建議爲DOM對象使用鉤子。他們還提供了下面這個例子：

var f = document.createElement;document.createElement = function(tagName){ 
console.log(tagName); 
f.apply(document, arguments); } 

我覺得這個功能會記錄所有的document.createElement()電話， 但我在哪裏，我userscript添加這個功能呢？
我試圖創建一個只包含這個函數的用戶腳本，但它沒有工作。

userscript在加載頁面後執行。如何改變這個功能，以便它能夠事先跟蹤動態功能？

Answer 1

要「事先跟蹤」所有動態載入的參數，請使用// @run-at document-start。

此外，您必須將代碼注入目標頁面，因爲頁面的JavaScript是您想要跟蹤的。

這是一個完整的腳本，可記錄所有createElement()調用。它的工作原理與兩個的Greasemonkey（火狐）和Chrome userscripts：

// ==UserScript== 
// @name  _Track dynamically added elements 
// @namespace Your PC 
// @include  http://YOUR_SERVER/YOUR_PATH/* 
// @run-at  document-start 
// ==/UserScript== 

//--- Intercept and log document.createElement(). 
function LogNewTagCreations() { 
    var oldDocumentCreateElement = document.createElement; 

    document.createElement   = function (tagName) { 
     var elem = oldDocumentCreateElement.apply (document, arguments); 
     console.log ("Dynamically created a(n)", tagName, " tag. Link: ", elem); 
     return elem; 
    } 
} 

/*--- The userscript or GM script will start running before the DOM is available. 
    Therefore, we wait... 
*/ 
var waitForDomInterval = setInterval (
    function() { 
     var domPresentNode; 
     if (typeof document.head == "undefined") 
      domPresentNode = document.querySelector ("head, body"); 
     else 
      domPresentNode = document.head; 
     if (domPresentNode) { 
      clearInterval (waitForDomInterval); 
      addJS_Node (null, null, LogNewTagCreations); 
     } 
    }, 
    1 
); 

//--- Handy injection function. 
function addJS_Node (text, s_URL, funcToRun) { 
    var D         = document; 
    var scriptNode       = D.createElement ('script'); 
    scriptNode.type       = "text/javascript"; 
    if (text)  scriptNode.textContent = text; 
    if (s_URL)  scriptNode.src   = s_URL; 
    if (funcToRun) scriptNode.textContent = '(' + funcToRun.toString() + ')()'; 

    var targ = D.getElementsByTagName ('head')[0] || D.body || D.documentElement; 
    targ.appendChild (scriptNode); 
}