使用中斷點暫停 JavaScript 程式碼。本指南將說明 DevTools 提供的每種中斷點類型,以及何時使用及如何設定每種類型。如需偵錯程序的互動式教學課程,請參閱「在 Chrome 開發人員工具中開始偵錯 JavaScript」。
各個中斷點類型的使用時機總覽
最常見的中斷點類型是程式碼行。不過,設定程式碼行中斷點可能效率不彰,尤其是當您不確定要查看哪個位置,或是使用大型程式碼集時。瞭解其他類型的中斷點的使用方式和時機,就能在偵錯時節省時間。
| 中斷點類型 | 適用情況 |
|---|---|
| 程式碼行 | 暫停在程式碼的特定區域。 |
| 條件式程式碼行 | 在程式碼的特定區域暫停,但只有在某些其他條件為 true 時才暫停。 |
| Logpoint | 將訊息記錄到控制台,且不暫停執行。 |
| DOM | 暫停會變更或移除特定 DOM 節點或其子項的程式碼。 |
| XHR | 當 XHR 網址含有字串模式時暫停。 |
| 事件監聽器 | 在觸發事件 (例如 click) 後執行的程式碼上暫停。 |
| 例外狀況 | 在擲回已偵測或未偵測到的例外狀況的程式碼行暫停。 |
| 功能 | 在呼叫特定函式時暫停。 |
| 信任類型 | 在遇到 Trusted Type 違規問題時暫停。 |
程式碼行中斷點
當您知道需要調查的確切程式碼區域時,請使用程式碼行中斷點。開發人員工具一律會在執行這行程式碼前暫停。
如要在開發人員工具中設定程式碼行中斷點,請按照下列步驟操作:
- 按一下「來源」面板。
- 開啟含有要中斷的程式碼行的檔案。
- 前往程式碼行。
- 程式碼行左側是行號欄,按一下該圖示。行號欄頂端會顯示藍色圖示。