Firebug 教程

什么是 Firebug？

Firebug 是一個(gè)開源的web開發(fā)工具。

在本章教程我們將討論以下內(nèi)容：

• 如何安裝 Firebug。
• 使用 Firebug 檢查和編輯 HTML。
• 使用 Firebug 檢查和編輯 CSS。
• 使用 Firebug 調(diào)試 JavaScript。
• 在 Firebug 中動(dòng)態(tài)執(zhí)行 JavaScript。
• 使用 Firebug 記錄 Javascript日志。
• 使用 Firebug 監(jiān)控網(wǎng)絡(luò)。

關(guān)于firebugs的最新補(bǔ)充：firebugs作為優(yōu)秀的web開發(fā)工具，現(xiàn)在已經(jīng)整合進(jìn)火狐的開發(fā)者選項(xiàng)中了，現(xiàn)在并不需要下載（也找不到最新的firebugs插件）firebugs來進(jìn)行頁(yè)面調(diào)試，直接使用F12開發(fā)者工具即可。所有的使用方式與本教程基本相似。
另外，Chrome瀏覽器也吸收了firebug的優(yōu)秀思想，其開發(fā)者工具的使用也與firebugs有異曲同工之妙。 

安裝 Firebug

Firebug下載地址： https://addons.mozilla.org/en-US/firefox/addon/1843/

使用Firefox瀏覽器訪問以上下載地址，打開頁(yè)面后，點(diǎn)擊下載按鈕后，會(huì)有個(gè)彈窗頁(yè)面，提示安裝的目錄，安裝后重啟你的Firefox瀏覽器。

重啟后就可以在Firefox瀏覽器中看到Firebug的圖標(biāo)。點(diǎn)擊Firebug圖標(biāo)(位于Firefox瀏覽器右上角)即可激活Firebug插件。

Firebug 組件

Firebug 選項(xiàng)

在頁(yè)面上點(diǎn)擊檢查元素

撤銷與恢復(fù)

顯示命令行

控制臺(tái)

HTML 面板

CSS 面板

腳本面板

DOM 面板

網(wǎng)絡(luò)面板 (用于網(wǎng)頁(yè)測(cè)速和優(yōu)化)

其他按鈕

• 1 - 最小化Firebug。
• 2 - 在瀏覽器窗口安裝Firebug。
• 3 - 停用Firebug。