# 介紹好用工具：Firebug ( Web 開發人員必備的工具 )

[Firebug](http://getfirebug.com/) 應該是所有開發人員必備的工具了，這是一個 Firefox 的外掛程式，它提供一大堆跟 Web 開發相關的工具，可以幫助你編輯、修改網頁的 DOM 物件，對 JavaScript 除錯，可以查看任何一個元素的 CSS, HTML 設定，還可以分析網頁下載的效能，甚至於還可以自己寫程式擴充 Firebug 的功能，功能多到很難一下學會所有功能。

不過我發現有些從來不使用 Firefox 瀏覽器的人真的不知道有這個好用的工具，這真是太可惜啦，保哥我強烈推薦每個人都應該裝起來用看看！目前最新的版本是 [Firebug 1.2](https://web.archive.org/web/20181111232755/https://addons.mozilla.org/zh-TW/firefox/addon/firebug/) 版，此版本已正式支援 Firefox 3 了。

Firebug 實在太有名了，有太多網站做出介紹了，所以我找了一些網站與影片供各位參考：

-   [Firebug 幫網頁稱重量、測速度，抓出拖慢網站的元兇！](http://briian.com/?p=5526)  
    
-   [Introduction to Firebug](https://web.archive.org/web/20220531194152/http://www.evotech.net/blog/2007/06/introduction-to-firebug/) \[英文\]  
    
-   [Introduction to CSS editing using Firebug](http://tw.youtube.com/watch?v=FsX6qwQqGgQ) \[YouTube\]  
    
    [![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/a569dcc01a7e87fc0ab5-video55e58a8e1a56.jpg)](http://www.youtube.com/watch?v=FsX6qwQqGgQ&hl=zh_TW&fs=1)
    
      
    
-   [Introduction to Debugging AJAX Application with Firebug](http://tw.youtube.com/watch?v=W4jXAaEMp2M) \[YouTube\]  
    
    [![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/480d0bf2839286056d11-video5e85db9828bb.jpg)](http://www.youtube.com/watch?v=W4jXAaEMp2M&hl=zh_TW&fs=1)
    
      
    
-   [其他在 YouTube 與 Firebug 相關的影片](http://tw.youtube.com/results?search_query=Firebug&search_type=&aq=f)

**相關連結**

-   [Firebug](http://getfirebug.com/)
-   [Firebug Documentation](http://getfirebug.com/docs.html)
-   [Firebug 1.2 Released](http://ejohn.org/blog/firebug-12-released/)
-   [Firefox Add-ons - Firebug 1.2](https://web.archive.org/web/20181111232755/https://addons.mozilla.org/zh-TW/firefox/addon/firebug/)