轉(zhuǎn)帖|使用教程|編輯:龔雪|2014-10-29 10:39:59.000|閱讀 272 次
概述:作者根據(jù)自身經(jīng)驗(yàn),分享JavaScript程序員需要掌握的5個(gè)debug技巧。
# 界面/圖表報(bào)表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
我一直使用,一般來說都是比較順利,但有時(shí)候,你會發(fā)現(xiàn)需要更好的方法。下面幾個(gè)JavaScript技巧相信你一定會覺得十分有用:
我以前也說過,你可以在JavaScript代碼中加入一句debugger;來手工造成一個(gè)斷點(diǎn)效果。
需要帶有條件的斷點(diǎn)嗎?你只需要用if語句包圍它:
if (somethingHappens) {
debugger;
}
但要記住在程序發(fā)布前刪掉它們。
有時(shí)候你會發(fā)現(xiàn)DOM不受你的控制,自己會發(fā)生一些奇怪的變化,讓你很難找出問題的根源。
谷歌瀏覽器的開發(fā)工具里有一個(gè)超級好用的功能,專門可以對付這種情況,叫做“Break on…”,你在DOM節(jié)點(diǎn)上右鍵,就能看到這個(gè)菜單項(xiàng)。
斷點(diǎn)的觸發(fā)條件可以設(shè)置成這個(gè)節(jié)點(diǎn)被刪除、節(jié)點(diǎn)的屬性有任何變化,或它的某個(gè)子節(jié)點(diǎn)有變化發(fā)生。
XHR斷點(diǎn),或Ajax斷點(diǎn),就像它們的名字一樣,可以讓我們設(shè)置一個(gè)斷點(diǎn),在特點(diǎn)的Ajax調(diào)用發(fā)生時(shí)觸發(fā)它們。
當(dāng)你在調(diào)試Web應(yīng)用的網(wǎng)絡(luò)傳輸時(shí),這一招非常的有效。
谷歌瀏覽器里有一些非常有趣的模擬移動(dòng)設(shè)備的工具,幫助我們調(diào)試程序在移動(dòng)設(shè)備里的運(yùn)行情況。
找到它的方法是:按F12,調(diào)出開發(fā)者工具,然后按ESC鍵(當(dāng)前tab不能是Console),你就會看到第二層調(diào)試窗口出現(xiàn),里面的Emulation標(biāo)簽頁里有各種模擬設(shè)備可選。
當(dāng)然,這不會就變成了真正的iPhone,只是模擬了iPhone的尺寸,觸摸事件和瀏覽器User Agent值。
是一個(gè)非常棒的工具。谷歌瀏覽器的開發(fā)者工具里也有一個(gè)非常類似的工具,叫Audits。
它可快速的審計(jì)你的網(wǎng)站,給你提出非常實(shí)際有效的優(yōu)化你的網(wǎng)站的建議和方法。
沒有這些工具,我不知道將如何開發(fā)。我還會寫更多的關(guān)于這方面的技巧——一旦我有所發(fā)現(xiàn),請關(guān)注我的最新文章。
原文出處: 譯文出處:
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉(zhuǎn)載自:慧都控件網(wǎng)