使用DOM Breakpoints找到修改屬性的Javascript程式碼

使用Chrome開發者工具的DOM斷點功能可以讓您快速找到修改了某一個DOM元素的Javascript程式碼。

在Chrome開發者工具裡，選中想要監控的DOM元素，點選右鍵，選擇Break on->Attributes modifications:

之後在DOM Breakpoints的tab裡能看到對應的斷點:

然後回到Chrome裡繼續操作，Chrome開發者工具的偵錯程式就會自動在DOM的屬性發生變化的地方停下來:

從偵錯程式的呼叫上下文能瞭解到是下圖第17行的hide方法設定了display:none的屬性導致DOM斷點的觸發。

要獲取更多Jerry的原創技術文章，請關注公眾號"汪子熙"或者掃描下面二維碼:

來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/24475491/viewspace-2151617/，如需轉載，請註明出處，否則將追究法律責任。