1.2 常用辅助开发工具介绍

1.2.1 Firebug

Firebug是一个开源的Web开发工具，是网页浏览器Mozilla Firefox下的一款开发类插件，现属于Firefox的五星级强力推荐插件之一。Firebug集HTML查看和编辑、Javascript控制台、网络状况监视器于一体，是开发JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士军刀，从各个不同的角度剖析Web页面内部的细节层面，给Web开发者带来很大的便利。当然谷歌和IE也都自带Web开发工具，可以根据个人喜好选择一款熟练使用，不过笔者非常热衷于使用Firebug。Firebug并不是火狐浏览器独有的，可以在任意支持Firebug的浏览器上面安装。

Firebug也是一个除错工具。用户可以利用它除错、编辑甚至删改任何网站的CSS、HTML、DOM以及JavaScript代码，还可以在火狐浏览器中直接安装Firebug插件，如图1-10、图1-11所示。

安装后重启Firefox浏览器，就可以在Firefox浏览器中看到Firebug的图标，如图1-12所示。单击Firebug图标（位于Firefox浏览器右上角）或者按F12键即可激活Firebug插件。

接下来我们介绍一下Firebug的功能。Firebug有5个主要的Tab按钮，这里将主要介绍这几方面的功能。

（1）控制台

控制台如图1-13所示。

（2）HTML

利用Inspect检查功能，我们可以用鼠标在页面中直接选择一些区块，查看相应的HTML源代码和CSS样式表，真正做到所见即所得。如果你使用外部编辑器修改了当前网页，可以单击Firebug的reload图片重新载入网页，它会继续跟踪之前用Inspect选中的区块，方便调试，如图1-14所示。

（3）DOM

该功能主要用于查看页面DOM信息，通过提供的搜索功能实现DOM的快速准确定位，并可双击实现DOM节点属性或值的修改，如图1-15所示。

（4）脚本（Javascript）

脚本功能主要是一个脚本调试器，可以进行单步调试、断点设置、变量查看等功能，同时通过右边的监控功能来实现脚本运行时间的查看和统计，提高运行效率，如图1-16所示。

（5）网络（Net）

该标签功能主要用来监控网页各组成元素的运行时间信息，方便找出其中运行时间较慢的部分，进一步优化运行效率，如图1-17所示。

1.2.2 HttpRequester

HttpRequester是一款接口的测试工具，和Firebug一样可以在火狐浏览器中通过附加组件的形式进行安装，如图1-18～图1-20所示。

可以模拟各种请求方式，并且可以自定义添加需要提交的请求报文和请求头信息。另外，还有很多的功能，希望大家多去尝试，这里只是为了抛砖引玉。当我们开发Wcf和WebAPI程序的时候，这个插件非常有用。