FireBug是一个专门为firefox而打造的调试工具，FireBug能够对js进行调试和编辑，让开发人员可以更好的来进行使用。并且它还会过滤一些日志消息，便于您可以收到所需的日志消息。
Firebug的激活是基于URL的，遵守相同的来源策略。这意味着，当您在不同的选项卡上打开同一个来源的页面时，Firebug会自动打开。当您在同一选项卡中打开不同来源的页面时，它会自动关闭。另一方面DevTools的激活是基于标签的。这意味着，当您在选项卡中打开DevTools时，即使您在不同网站之间切换，它们也会保持打开状态。当你切换到另一个标签，但是，他们被关闭。
打开工具
按F12可打开Firebug。要打开它来检查元素，可以按Ctrl+ Shift+ C/ Cmd+ Opt+ C。DevTools共享相同的快捷键，但也提供了不同面板的快捷键。例如，网络监视器可以通过Ctrl+ Shift+ Q/ Cmd+ Opt+ 打开Q，Web控制台通过Ctrl+ Shift+ K/ Cmd+ Opt+ K打开，调试器通过Ctrl+ Shift+ S/ Cmd+ Opt+ 打开S。
该Web控制台是Firebug的相当于控制台面板。它显示与网页相关的日志信息，并允许您通过命令行执行JavaScript表达式。两者之间的显示有所不同。这可能会改变错误1269730。
过滤日志消息
Firebug提供了两种方法来过滤日志消息，通过选项菜单和工具栏中的过滤器按钮。开发者工具控制台通过其工具栏内的过滤器按钮提供类似的功能- 集中在一个地方。
命令行API
Firebug中的命令行API提供了一些特殊功能，以方便您使用。开发工具命令行有一些共同的功能，但也有一些其他的功能，错过了别人。
控制台API
从网页内将东西记录到控制台Firebug 在页面中提供了一个控制台API。开发者工具共享相同的API，所以你的console.*语句将继续工作。
坚持日志
在Firebug中，您可以单击工具栏中的Persist按钮以保留页面导航和重新加载之间记录的消息。在DevTools中，这个选项被称为启用日志，并且在“工具箱选项”面板中可用。
服务器日志
像FirePHP这样的Firebug扩展允许将服务器端消息记录到Firebug控制台。该功能已经使用ChromeLogger协议集成到DevTools中，不需要安装任何扩展。
命令历史
该命令历史记录可通过在Firebug的命令行按钮，可以按↑/ ↓在DevTools命令行中。
查看每个文件的时间线
功能2：检查Http相关信息
检查HTTP头
监视XMLHttpRequest
功能3：调试JavaScript
设置断点
在任意行暂停
直接跳转到指定行
功能4：查看DOM相关信息
根据需要选择查看所需的内容
导航到JavaScript代码
功能5：JavaScript Logging
使用如 Console.log(“hello world”)
输入到Firebug 的 控制台
功能6：Html相关信息
动态查看代码
即时的HTML编辑
使用鼠标定位到元素
查找
查看、编辑、重新加载 复制代码
功能7：CSS相关信息
查看级联
预览颜色和图像
手调CSS
启用/禁用CSS样式属性
点击附加组件。如图
输入firebug，查询，找到你要的附加组件，下载并安装。
安装好了后在火狐浏览右上角会有一个小虫虫的。如下图。
我我们可以单击他。或是按F12来招换出来firebug，进入调式页面。
可以查看网络等什么。
Firebug团队发布了Firebug 1.11.1。这是一个后续版本
Firebug1.11.1修复了3个问题。
6116问题：未定义的值将被忽略字符串格式的console.log
6119问题：`空白位置的元素：pre-wrap的显示不正确
6124问题：添加Firebug规则，如新的样式标签.firebug ResetStyles {}。
v1.10
新版的 FireBug 1.10，发现新特性还真不少。不过没有在网上看到完整的中文介绍。简单翻译一下，方便大家。
新特性
安装后无需重启浏览器
延迟加载
Cookie 管理
命令行编辑器的语法着色
自动完成
样式追踪
新的命令: help
链接到 Web 字体定义
支持媒体查询
实体显示格式
颜色显示格式
菜单项的工具提示
支持 “focus” CSS 伪类
来自 BFCache 的 HTTP 请求
删除 CSS 规则
安装后无需重启
【软件介绍】
Firebug(也被称为：萤火虫)是 firefox 下的一个扩展工具,能够调试所有网站语言，如Html,Css等，但FireBug吸引人的就是javascript调试功能，使用起来非常方便，而且在各种浏览器下都能使用（IE,Firefox,Opera, Safari）。【软件特色】
激活Firebug的激活是基于URL的，遵守相同的来源策略。这意味着，当您在不同的选项卡上打开同一个来源的页面时，Firebug会自动打开。当您在同一选项卡中打开不同来源的页面时，它会自动关闭。另一方面DevTools的激活是基于标签的。这意味着，当您在选项卡中打开DevTools时，即使您在不同网站之间切换，它们也会保持打开状态。当你切换到另一个标签，但是，他们被关闭。
打开工具
按F12可打开Firebug。要打开它来检查元素，可以按Ctrl+ Shift+ C/ Cmd+ Opt+ C。DevTools共享相同的快捷键，但也提供了不同面板的快捷键。例如，网络监视器可以通过Ctrl+ Shift+ Q/ Cmd+ Opt+ 打开Q，Web控制台通过Ctrl+ Shift+ K/ Cmd+ Opt+ K打开，调试器通过Ctrl+ Shift+ S/ Cmd+ Opt+ 打开S。
该Web控制台是Firebug的相当于控制台面板。它显示与网页相关的日志信息，并允许您通过命令行执行JavaScript表达式。两者之间的显示有所不同。这可能会改变错误1269730。
过滤日志消息
Firebug提供了两种方法来过滤日志消息，通过选项菜单和工具栏中的过滤器按钮。开发者工具控制台通过其工具栏内的过滤器按钮提供类似的功能- 集中在一个地方。
命令行API
Firebug中的命令行API提供了一些特殊功能，以方便您使用。开发工具命令行有一些共同的功能，但也有一些其他的功能，错过了别人。
控制台API
从网页内将东西记录到控制台Firebug 在页面中提供了一个控制台API。开发者工具共享相同的API，所以你的console.*语句将继续工作。
坚持日志
在Firebug中，您可以单击工具栏中的Persist按钮以保留页面导航和重新加载之间记录的消息。在DevTools中，这个选项被称为启用日志，并且在“工具箱选项”面板中可用。
服务器日志
像FirePHP这样的Firebug扩展允许将服务器端消息记录到Firebug控制台。该功能已经使用ChromeLogger协议集成到DevTools中，不需要安装任何扩展。
命令历史
该命令历史记录可通过在Firebug的命令行按钮，可以按↑/ ↓在DevTools命令行中。
【功能介绍】
功能1：Monitor network activity查看每个文件的时间线
功能2：检查Http相关信息
检查HTTP头
监视XMLHttpRequest
功能3：调试JavaScript
设置断点
在任意行暂停
直接跳转到指定行
功能4：查看DOM相关信息
根据需要选择查看所需的内容
导航到JavaScript代码
功能5：JavaScript Logging
使用如 Console.log(“hello world”)
输入到Firebug 的 控制台
功能6：Html相关信息
动态查看代码
即时的HTML编辑
使用鼠标定位到元素
查找
查看、编辑、重新加载 复制代码
功能7：CSS相关信息
查看级联
预览颜色和图像
手调CSS
启用/禁用CSS样式属性
【安装说明】
在火狐的右上角，点击后如图，点击附加组件。如图
输入firebug，查询，找到你要的附加组件，下载并安装。
安装好了后在火狐浏览右上角会有一个小虫虫的。如下图。
我我们可以单击他。或是按F12来招换出来firebug，进入调式页面。
可以查看网络等什么。
【更新日志】
v1.11.1Firebug团队发布了Firebug 1.11.1。这是一个后续版本
Firebug1.11.1修复了3个问题。
6116问题：未定义的值将被忽略字符串格式的console.log
6119问题：`空白位置的元素：pre-wrap的显示不正确
6124问题：添加Firebug规则，如新的样式标签.firebug ResetStyles {}。
v1.10
新版的 FireBug 1.10，发现新特性还真不少。不过没有在网上看到完整的中文介绍。简单翻译一下，方便大家。
新特性
安装后无需重启浏览器
延迟加载
Cookie 管理
命令行编辑器的语法着色
自动完成
样式追踪
新的命令: help
链接到 Web 字体定义
支持媒体查询
实体显示格式
颜色显示格式
菜单项的工具提示
支持 “focus” CSS 伪类
来自 BFCache 的 HTTP 请求
删除 CSS 规则
安装后无需重启