如何在頁(yè)面中調(diào)試JavaScript

插入 alert 進(jìn)入代碼是最常見(jiàn)的方式，可以提示變量的值、類(lèi)型，函數(shù)參數(shù)，對(duì)象屬性。如果你用分支代碼以支持分別做不同的事，你可以使用 confirm 來(lái)強(qiáng)制執(zhí)行指定的分支功能。如果你想能夠剪切粘貼結(jié)果可使用 prompt。 

要想得到更詳細(xì)的錯(cuò)誤報(bào)告你可以使用 window.onerror 或 try..catch 語(yǔ)句。這會(huì)讓代碼直接運(yùn)行，不會(huì)因某個(gè)錯(cuò)誤而終止掛起，從而在代碼執(zhí)行完成后報(bào)告出所有的錯(cuò)誤。 
有些錯(cuò)誤在我們不知不覺(jué)中進(jìn)入我們的代碼，并且難于發(fā)現(xiàn)。我們要嚴(yán)格遵守代碼約定，如用分號(hào)顯式地結(jié)束語(yǔ)句而不是用分號(hào)插入；總是使用花括號(hào)把控制結(jié)構(gòu)括起來(lái)如 if, if..else, switch, while, do..while, for, for..in 語(yǔ)句； 使用圓括號(hào)來(lái)表示優(yōu)先而不是靠運(yùn)算符本身的優(yōu)先等組；使用統(tǒng)一的詳細(xì)的命名規(guī)則；使用統(tǒng)一的代碼縮進(jìn)規(guī)則讓源碼更易讀；使用顯式的類(lèi)型聲明避免自動(dòng)類(lèi)型或者采別的方式達(dá)到同樣效果；對(duì)于不同的瀏覽器有些簡(jiǎn)便的方式（特別是 ie）,盡量使用符合標(biāo)準(zhǔn)語(yǔ)法的代碼……。通過(guò)以上方式減少這些難以發(fā)現(xiàn)的錯(cuò)誤產(chǎn)生。 
可以通過(guò) js lint來(lái)運(yùn)行代碼，它可以檢測(cè)某些潛在的錯(cuò)誤。 

以上是我們通過(guò)代碼本身做的事。下面我們看看在瀏覽器中代碼的檢測(cè) 

使用多個(gè)不同類(lèi)型的瀏覽器測(cè)試你開(kāi)發(fā)的角本。在windows環(huán)境中，至少要用到 ie6w、op7以及moz。在mac機(jī)中，要至少用到 saf、op7、ie5m和moz。如果存在代碼在一個(gè)或多個(gè)瀏覽器中不起作用，要看看換些不同的代碼能否解決。如果還不行，就要根據(jù)不同瀏覽器做一個(gè)分支執(zhí)行代碼。 
在 ie中一定要啟用錯(cuò)誤報(bào)告。如果使用的是 windows，可以利用 Microsoft Script Debugger。如果需跟蹤一個(gè)錯(cuò)誤，你可以利用角本中的 debugger 關(guān)鍵字控制角本在調(diào)試模式下執(zhí)行。推薦主要使用 ie 測(cè)試，用 op7 或 moz 來(lái)調(diào)試。 
在 Op7 當(dāng)中，一定要啟用 在JavaScript Console 中 JavaScript 錯(cuò)誤報(bào)告。Op7 的 JavaScript Console 遠(yuǎn)比 ie 錯(cuò)誤報(bào)告要好些，擁有更好的代碼跟蹤功能，更容易看到函數(shù)調(diào)用來(lái)源。并且可以報(bào)告出正確的錯(cuò)誤行，不同于 iew 。 

在 moz 中有很多工具�？衫�用 Mozilla JavaScript Console，它可以報(bào)告錯(cuò)誤和警告，并且允許做簡(jiǎn)單的角本賦值。可以啟用嚴(yán)厲警告提示出許多潛在錯(cuò)誤位置。可以使用 DOM Inspector 顯示 document 樹(shù)，stylesheets 樹(shù)，computed styles，JavaScript 對(duì)象�？梢杂� Venkman （Mozilla JavaScript Debugger）獲取更高級(jí)的 JavaScript 調(diào)試工具�？晒┦褂玫挠� Ian Hickson’s JavaScript Evaluation Sidebar 或者 Jesse Ruderman’s JavaScript Environment、view scripts bookmarklet、JavaScript Shell 或者 view variables bookmarklet 或者 ViewScripts bookmarklet 。 

在 konq 當(dāng)中，靠自己的力量要更多些，使用一些源代碼的技巧。 
在 saf 中需要啟用隱藏調(diào)試菜單（Hiden debug menu），不用在系統(tǒng)控制臺(tái)顯示毫無(wú)意義的錯(cuò)誤信息，使用 Show DOM Tree 功能會(huì)更有用。如果你啟用了顯示調(diào)試菜單，Safari不運(yùn)行，在終端使用下面的命令： 

代碼:
defaults write com.apple.Safari IncludeDebugMenu 1