如何跟蹤DOM元素髮生了什麼？

我正在使用masked input plugin工作的網絡應用程序。我在申請中$(document).ready()使用類選擇口罩：如何跟蹤DOM元素髮生了什麼？

$(".Primary_Phone_Number").mask("(999) 999-9999"); 
$(".ZipCodeMask").mask("99999"); 
$(".StateMask").mask("aa"); 
$(".date").mask("99/99/9999");

然而，除了電話號碼一切都失去了它的面具。文檔準備好後，如果我再次在控制檯中運行它們，它們將獲得並保留其蒙版。

這是一個大型的網絡應用程序，每個頁面都有1000行的javascript，並且有很多不同的選擇器在進行更改以及大量的ajax調用。我們只在IE中測試Web應用程序，因爲它是一個內部項目。有什麼可用的IE10讓我知道什麼時候一個特定的DOM元素被操縱？

Chrome，Firefox或Opera中的行爲是否發生？如果是這樣，你可以在那裏調試並在IE中測試。 – kmoe

作爲一個整體的應用程序只能在IE中使用。自第一天起，我們還沒有支持任何其他瀏覽器。我已經在Chrome中嘗試過，並且東西開始失敗。 –

在其他瀏覽器中，所有的AJAX都是「OPTIONS」，而不是'GET'或'POST'。我們從未考慮過修補程序，因爲我們不支持它們。 –

如果您使用Chrome（並且您可以將其用於調試，如果問題重現），則可以在DOM修改上放置斷點。

檢查元素，右鍵單擊它，選擇「Break on ...」並選擇事件類型（例如子樹修改）。 More info on this。

如果您仍想在IE（9+）中執行此操作，則可以使用Mutation Events並在修改元素時中斷JS執行。

E.g.

el.addEventListener("DOMSubtreeModified", function(ev) { 
    debugger; 
}. false);

2014-02-06 17:04:48 Paker

回答