調試未捕獲的語法錯誤的有效方法是什么？

Question

最近，我陷入了未捕獲的語法錯誤，並且對如何有效調試它們一無所知。 我使用的是Chrome，但在出現未捕獲的語法錯誤時，我看不到發生了什么，因為就我所知，Chrome的調試似乎只能調試自己的書面代碼，而不能調試正在執行的代碼。調試（無論如何，這是入門級）。

所以我在這里得到了這段代碼： http : //jsfiddle.net/0e5ue9k7/2/

問題是我打電話時出現意外的'}'

function userTurn(attack) {
....
}

在第283行，由

function combat {
....
}

按下按鈕后在第259行。 我知道問題出在按鈕onclick事件上，但是我不確定是什么錯誤，發生了什么以及如何更改它，因為語法錯誤尚未捕獲。 解決此問題的最佳方法是什么？

任何幫助將不勝感激！ 如果有任何不清楚的地方，請通知我。

Answer 1

在Chrome中，您可以通過點擊調試器中的（||）圖標來調試“未捕獲的異常”。 如果要調試捕獲的異常，請選中“暫停捕獲”選項。

Answer 2

您無法在JavaScript代碼中找到丟失的“}”，因為該錯誤出在程序吐出的生成的HTML代碼中。

<button class="combatMoves" onclick="userTurn(" help")"="">Help</button>

看你的代碼

<button class="combatMoves" onclick="userTurn("help")"="">Help</button>

什么時候應該

<button class="combatMoves" onclick="userTurn('help')"="">Help</button>

但是由於您已經使用'構建了字符串，所以'字符需要轉義\\'

通常，當瀏覽器在單擊某些內容時引發錯誤並且找不到行號時，請單擊您單擊的元素。

基本修復：

controller.innerHTML = 'Choose an attack!<br><button class="combatMoves" onclick="userTurn(\'bow\')"> ...

進入不使用內聯事件處理程序的實踐。