大名鼎鼎的Firebug绝对是用来帮助您进行前端开发和调试的利器,这里我们绝对要把他收录到开发者必备精选集中。
Firebug同Firefox连接在一起,形成了强大的网页开发工具。您可以通过Firebug来编辑、调试和监控任何页面的CSS、HTML和JavaScript。

查看和编辑HTML代码
通过Firebug可以很简单的查找页面中的HTML元素。并且在您找到了需要的HTML元素之后,Firebug还提供了大量的相关信息,并且允许您动态的编辑HTML元素及其属性。

动态调整CSS

Firebug的CSS标签可以告诉您所有需要的style信息,如果您不喜欢现在的样式,直接就可以编辑CSS规则改变这些样式。

可视化的CSS模型
调试中,您设计的CSS盒子模型可能不象想象中那样整齐,而这些模型又都很难懂或者难以想象。Firebug完全可以帮助您,他能够显示出正确的盒子模型以及一些关键的数据,比如大小阿、margin阿、边界阿、内边距阿等等。

监控网络活动
页面读取花费了很长时间?为什么?是不是写了很多的JavaScript?还是忘记压缩图片了?是不是页面上引用的第三方资源太慢了?Firebug可以一项一项的把这些关键点都列出来,让您知道页面读取的细节信心。

调试JavaScript
Firebug中包含了一个非常强大的JavaScript调试器,您可以在任何时候给页面中的代码设置断点,然后从调试器进入到代码的世界,查看变量值等等。如果您的代码有点慢,不妨使用JavaScript的分析工具来测量一下性能,快速找到瓶颈所在。

快速查找错误
Firebug能够在第一时间内向您报告出页面上包含的错误,包括JavaScript、CSS和XML的错误信息。

查看DOM
DOM即文档对象模型,是HTML页面形成的关键数据结构,他把页面中所有的HTML元素拼装成一个模型中,以便JavaScript代码来控制他们。Firebug能够帮助您查找并详细查看DOM对象,甚至能够直接动态编辑这些DOM对象。

直接运行JavaScript代码
命令行是所有编程工具中最古老的一种了。Firebug也给您提供了这种怀旧的但是确实强大的命令行工具,可以方便您直接在命令上使用JavaScript。

JavaScript输出日志
有时候光有强劲的调试器还不够,可能简单的在控制台上输出大量运行信息是更为直接和快速的方式。Firebug给您提供了一系列同样强大的日志输出函数可以帮助到您。

需要在其他浏览器上使用Firebug?现在有福了,可以用Firebug Lite,还包括在Chrome上的扩展哦!

注意注意:

现在官方扩展中心上的Firebug还是1.6系列,对于Firefox 4的支持不是很好,要想支持Firefox 4,需要使用1.7系列的,不过1.7系列还处于测试阶段,所以官方扩展中心还没有更新,大家如果需要在Firefox 4上使用Firebug,可以来这里安装

— — 转载至火狐官方。

声明:本站分享的WordPress主题/插件均遵循 GPLv2 许可协议(免费开源),相关介绍资料仅供学习参考,实际版本可能会因版本迭代或开发者调整而产生变化,如程序中涉及有第三方原创图像、设计模板、远程服务等内容,应获得作者授权后方可使用。本站不提供该程序/软件的产品授权与技术服务,亦不收取相关费用。