在很多時候, 頁面上一個元素的屬於被修改、刪除,子節點的添加與修改,很難一下找到對應的代碼,在 google chrome 開發者工具里, 提供了對 DOM 元素的監控:
在 Elements 標簽, 右擊有監控的元素,在彈出來的菜單中有一個 Break on 的菜單項, 下面有三個子菜單項
subtree modifcations: 監控當前元素子級元素結構的變化,添加結點和刪除節點,移動節點不知道算不算。
attribute modifcations: 監控當前元素屬性的變化。
node removal: 監控當前節點刪除。
當設置好這些后, 當腳本修改這些元素時, google chrome 就會在修改代碼那里斷點, 方便我們找到修改元素的最終代碼。