js調試方法很多，今天總結一下最實用的的斷點方法:

debugger斷點

這個很常見，但許多人不知道其實可以添加條件判斷

if(something){debugger;}

source斷點

這個最為常見，不做過多解釋，具體說一下幾個重要圖標:

恢復腳本執行至下一個斷點

跳到下一行

進入當前函數

跳出當前函數

開啟/關閉斷點

異常情況下自動斷點

其中 "進入當前函數"和"跳出當前函數"容易混淆，其實大多數情況下兩者區別不大，區別在於:如果當前斷點語句是一個函數執行語句，例如a（）；，"進入當前函數"會進入其函數體，跳出當前函數則不會。

DOM斷點

選擇dom元素，右鍵break on，即可選擇subtree modifications(子節點樹發生改變)、attribution modifications(屬性發生改變)、node removal(節點移除)，添加節點,可在Source-->DOM Breakpoints或者Element-->DOM Breakpoints內查看

事件監聽（event listener）斷點

Source-->Event Listener Breakpoints中可查看事件監聽斷點，在checkbox內打鉤即可監聽頁面裏所有的相應事件

XHR斷點

我們可以通過Source-->XHR Breakpoints"右側的"+"號為異步斷點添加斷點條件，當異步請求觸發時的URL滿足此條件，JS邏輯則會自動產生斷點。

js調試筆記