如何在頁面刷新時保留Chrome DOM斷點？

Question

我想查看哪些代碼正在修改網頁上的DOM元素，所以我通過右鍵單擊DevTools檢查器的元素選項卡中的元素並選擇「Break on ...」 - >在Chrome中設置斷點， 「子樹修改」。腳本在頁面加載時（而不是在後面）修改元素，所以我想保留DOM斷點並刷新頁面。

在JavaScript代碼中保存斷點的過程似乎不適用於DOM斷點。

Answer 1

現在我加入了debugger;行任何其他代碼運行之前，增加了一個DOM斷點，並繼續。

Answer 2

在Chrome中，刷新時不會保留DOM斷點，它們會被拋棄，然後在onload事件後恢復。請參閱bug report 571519以及該報告中的此評論：

我們在重新加載時保留DOM斷點，但斷點僅在onload事件時恢復。因此，如果您希望在此之前觸發斷點，或者它在延遲添加的節點上設置，則不會恢復斷點。我們應該修復這個問題。

這是解決方法：

1. 暫停的JavaScript，無論是與一個普通的斷點或debugger;一行JavaScript
2. 刪除所有DOM斷點，並添加所需的DOM斷點
3. 恢復。