一区中文字幕,国产在线一二,国产一区99

FireBug 調(diào)試JS入門 —如何調(diào)試JS

安裝就不用說(shuō)了，很簡(jiǎn)單，在FireFox上插件庫(kù)里找到FireBug就Ok了。下圖是FireBug Debug 窗口。

     FireBug美工用的非常普遍，公司美工妹妹用的非常熟練呵呵，而對(duì)于我們開(kāi)發(fā)人員，主要用它來(lái)Debug JS?？纯垂俜綄?duì)Debug功能的介紹。
Firebug includes a powerful JavaScript debugger that lets you pause execution at any time and see what each variable looked like at that moment. If your code is a little sluggish, use the JavaScript profiler to measure performance and find bottlenecks fast.
      簡(jiǎn)而言之，F(xiàn)ireBug 可以讓我們?cè)谌魏螘r(shí)候debugJS 并查看變量，同時(shí)可以通過(guò)它找出JS中性能瓶頸。
      下圖是如何找到Web應(yīng)用的JS，激活Firebug，點(diǎn)Script，然后在All 旁邊選擇你要Debug的JS。

下圖是如何打斷點(diǎn) 基本跟Eclipse一樣，點(diǎn)擊行號(hào)就Ok了。

下圖是如何在斷點(diǎn)上設(shè)定條件，如果條件符合，就進(jìn)入斷點(diǎn)，這個(gè)功能很不錯(cuò)，特別是Debug很復(fù)雜的Function時(shí)候。

下圖是如何單步調(diào)試，跟Eclipse一樣 F11單步

下圖是查看調(diào)用的Stack，對(duì)以復(fù)雜的JS Debug很有幫助。

下圖是查看變量基本跟EclipseDebug 一樣。

下圖是在斷點(diǎn)處查看變量。

有個(gè)很好用的功能，代碼行之間快速調(diào)轉(zhuǎn)，使得對(duì)上千行的JS調(diào)試很輕松。

下圖就是Performance 測(cè)試結(jié)果，使用很簡(jiǎn)單點(diǎn)Profile

還有一個(gè)Log功能比較實(shí)用，看下圖如果你不想每次都進(jìn)入斷點(diǎn)，用這個(gè)就再好不過(guò)了。

基本用法就這些了，希望對(duì)大家有幫助。

posted on 2009-04-14 20:01 advincenting 閱讀(54067) 評(píng)論(19) 編輯收藏所屬分類: 腳本

評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-04-15 10:15 于翔

謝謝，非常有用！回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-04-15 13:01 huliqing

確實(shí)很不錯(cuò)，并且看起來(lái)與IE8的“開(kāi)發(fā)人員工具”很相似。回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-04-15 16:45 demo

應(yīng)該是IE8的“開(kāi)發(fā)人員工具”與firebug在靠近。回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-04-17 23:09 foot

很實(shí)用，
調(diào)試是門學(xué)問(wèn)。回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-07-28 13:14 ZengJerry

但是對(duì)基于jQuery編寫的插件式的js文件，好像無(wú)法跟蹤進(jìn)去。試了好多次，雖然在js文件中設(shè)置了斷點(diǎn)，但就是debug不到回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-07-28 19:28 advincenting

沒(méi)有問(wèn)題啊我們就在JQuery上Debug的，你是哪個(gè)版本的回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-08-23 09:38 jwkljh@qq.com

請(qǐng)問(wèn)你有適合3.0以上版本的firefox的firebug插件嗎回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2013-07-06 11:35 creak

@huliqing
ie的調(diào)試是后出的跟人家學(xué)的你的意思等同于爹跟兒挺像的回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2013-07-30 15:06 fsdf

sdfsdfs 回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2014-05-16 12:09 sunsong

最后一個(gè)log功能沒(méi)說(shuō)清楚，可以詳細(xì)說(shuō)說(shuō)嘛，我到處點(diǎn)沒(méi)看到這個(gè)功能. 回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS[未登錄](méi) 2014-09-15 08:35 cc

講的很詳細(xì)，對(duì)我很有幫助，非常感謝回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2014-10-14 10:07 hah

很不錯(cuò)啊回復(fù) 更多評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2015-02-10 15:53 舒健

@ZengJerry
同感回復(fù) 更多評(píng)論

新用戶注冊(cè) 刷新評(píng)論列表


只有注冊(cè)用戶登錄后才能發(fā)表評(píng)論。




網(wǎng)站導(dǎo)航: 博客園 IT新聞 Chat2DB C++博客博問(wèn) 管理
相關(guān)文章: 在線 base64 測(cè)試 getElementByClassName some ways. JS 數(shù)組操作 FireBug 調(diào)試JS入門 —如何調(diào)試JS DOM小結(jié) substring跟substr區(qū)別 JS的正則表達(dá)式 js實(shí)相繼承小例

新的起點(diǎn) 新的開(kāi)始

FireBug 調(diào)試JS入門 —如何調(diào)試JS

評(píng)論

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-04-15 10:15 于翔

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-04-15 13:01 huliqing

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-04-15 16:45 demo

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-04-17 23:09 foot

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-07-28 13:14 ZengJerry

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-07-28 19:28 advincenting

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2009-08-23 09:38 jwkljh@qq.com

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS[未登錄](méi) 2010-04-02 12:03 dd

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS[未登錄](méi) 2011-08-19 13:39 liyang

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS[未登錄](méi) 2011-11-24 11:15 zg

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS[未登錄](méi) 2012-04-25 13:28 dd

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS[未登錄](méi) 2012-04-25 13:28 dd

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS[未登錄](méi) 2013-05-20 17:07 easy

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2013-07-06 11:35 creak

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2013-07-30 15:06 fsdf

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2014-05-16 12:09 sunsong

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS[未登錄](méi) 2014-09-15 08:35 cc

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2014-10-14 10:07 hah

# re: FireBug 調(diào)試JS入門 —如何調(diào)試JS 2015-02-10 15:53 舒健

公告

統(tǒng)計(jì)

常用鏈接

留言簿(13)

隨筆分類(71)

隨筆檔案(179)

文章檔案(13)

新聞分類

IT人的英語(yǔ)學(xué)習(xí)網(wǎng)站

JAVA站點(diǎn)

優(yōu)秀個(gè)人博客鏈接

官網(wǎng)學(xué)習(xí)站點(diǎn)

生活工作站點(diǎn)

最新隨筆

搜索

積分與排名

最新評(píng)論

閱讀排行榜

評(píng)論排行榜