FireBug 調(diào)試JS入門教程 如何調(diào)試JS
更新時(shí)間:2013年12月23日 00:05:28 作者:
這篇文章主要為大家介紹下通過firefox的FireBug調(diào)試JS,需要的朋友可以參考下
安裝就不用說了,很簡單,在FireFox上插件庫里找到FireBug就Ok了。下圖是FireBug 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.
簡而言之,F(xiàn)ireBug 可以讓我們在任何時(shí)候debugJS 并查看變量,同時(shí)可以通過它找出JS中性能瓶頸。
下圖是如何找到Web應(yīng)用的JS,激活Firebug,點(diǎn)Script,然后在All 旁邊選擇你要Debug的JS。
下圖是如何打斷點(diǎn) 基本跟Eclipse一樣,點(diǎn)擊行號就Ok了。
下圖是在斷點(diǎn)處查看變量。
有個(gè)很好用的功能,代碼行之間快速調(diào)轉(zhuǎn),使得對上千行的JS調(diào)試很輕松。
還有一個(gè)Log功能比較實(shí)用,看下圖 如果你不想每次都進(jìn)入斷點(diǎn),用這個(gè)就再好不過了。
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.
簡而言之,F(xiàn)ireBug 可以讓我們在任何時(shí)候debugJS 并查看變量,同時(shí)可以通過它找出JS中性能瓶頸。
下圖是如何找到Web應(yīng)用的JS,激活Firebug,點(diǎn)Script,然后在All 旁邊選擇你要Debug的JS。
下圖是如何打斷點(diǎn) 基本跟Eclipse一樣,點(diǎn)擊行號就Ok了。
下圖是在斷點(diǎn)處查看變量。
有個(gè)很好用的功能,代碼行之間快速調(diào)轉(zhuǎn),使得對上千行的JS調(diào)試很輕松。
還有一個(gè)Log功能比較實(shí)用,看下圖 如果你不想每次都進(jìn)入斷點(diǎn),用這個(gè)就再好不過了。
您可能感興趣的文章:
- JavaScript調(diào)試技巧之console.log()詳解
- JS調(diào)試必備的5個(gè)debug技巧
- js調(diào)試工具Console命令詳解
- 使用Chrome調(diào)試JavaScript的斷點(diǎn)設(shè)置和調(diào)試技巧
- 使用Firebug對js進(jìn)行斷點(diǎn)調(diào)試的圖文方法
- IE下js調(diào)試工具Companion.JS
- js調(diào)試工具console.log()方法查看js代碼的執(zhí)行情況
- 調(diào)試Javascript代碼(瀏覽器F12及VS中debugger關(guān)鍵字)
- js調(diào)試系列 斷點(diǎn)與動態(tài)調(diào)試[基礎(chǔ)篇]
- JavaScript調(diào)試的多個(gè)必備小Tips
相關(guān)文章
JS+CSS制作DIV層可(最小化/拖拽/排序)功能實(shí)現(xiàn)代碼
DIV層最小化和隨意拖拽排序,很多的愛好者都想實(shí)現(xiàn)這個(gè)功能,小編整理搜集了一下,希望本文的知識點(diǎn)可以幫助到你2013-02-02javascript數(shù)組遍歷的方法實(shí)例分析
這篇文章主要介紹了javascript數(shù)組遍歷的方法,結(jié)合實(shí)例形式分析了javascript數(shù)組遍歷及相關(guān)的some、every、filter、map等方法的使用技巧,需要的朋友可以參考下2016-09-09js實(shí)現(xiàn)上傳圖片之上傳前預(yù)覽圖片
此功能用js實(shí)現(xiàn),然后在fileupload控件的change事件中調(diào)用,這樣當(dāng)用fileupload選擇完圖片以后,圖片就會自動顯示出來了,感興趣的各位可以參考下哈2013-03-03使用element-ui的upload組件上傳代碼包時(shí)遇到的問題小結(jié)
這篇文章主要介紹了使用element-ui的upload組件上傳代碼包時(shí)遇到的問題及總結(jié),本文通過示例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-12-12Javascript 高性能之遞歸,迭代,查表法詳解及實(shí)例
這篇文章主要介紹了Javascript 高性能之遞歸,迭代,查表法詳解及實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-01-01JS時(shí)間戳與日期格式的轉(zhuǎn)換小結(jié)
這篇文章主要介紹了JS時(shí)間戳與日期格式的轉(zhuǎn)換小結(jié),本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-01-01JS實(shí)現(xiàn)定時(shí)任務(wù)每隔N秒請求后臺setInterval定時(shí)和ajax請求問題
這篇文章主要介紹了JS實(shí)現(xiàn)定時(shí)任務(wù)每隔N秒請求后臺setInterval定時(shí)和ajax請求 的相關(guān)資料,需要的朋友可以參考下2017-10-10echarts報(bào)錯:Error?in?mounted?hook的解決方法
最近又遇到了寫echarts的時(shí)候常遇到的一個(gè)錯誤,這篇文章主要給大家介紹了關(guān)于echarts報(bào)錯:Error?in?mounted?hook:?“TypeError:?Cannot?read?properties?of?undefined?(reading?‘init‘)“的解決方法,需要的朋友可以參考下2022-07-07