web—firebug常用功能使用方法

大家好，欢迎来到IT知识分享网。

Firebug 是一个开源的web开发工具。

功能： 1.控制台 2.查看和修改HTML 3.CSS调试 4.网络状况监视器 5.Javascript调试器 6.Dom查看器

常用的：2.3.4.5

一、firebug组件简介

1.firebug选项，点击firebug图标

2.检查元素（点击页面元素，右键选择使用firebug查看元素）

3.撤销与恢复

4.显示命令行

5.控制台

主要使用javascript命令行操作，显示javascript错误信息，在底部的>>>提示符后，你可以自己键入javascript命令

6.HTML

查看和修改html源码

7.CSS

网页设计师专用

8.脚本

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

9.网络

用于网页测速和优化，显示本页面涉及的所有下载，以及它们各自花费的时间，各自的HTTP请求头信息和服务器响应的头信息。XHR标签对AJAX调试很有用。

10.DOM

查看页面DOM信息，即所有的页面对象和window物体的属性。因为在javascript中，所有变量都是window物体的属性，所以Firebug会显示所有变量和它们的值。

二、常用功能

1.查看和修改html

如把百度首页的知道改为不知道

a.F12调出firebug,点击html

b.打开百度首页

c.点击firebug的选择元素按钮后，再点击百度的知道,自动定位到firebug的html源码的相应位置

d.直接修改内容即可，重新刷新网页就恢复了，因此可以随便放心的修改

2.css调试

如把百度首页上的链接改下行高

a.F12调出firebug,点击css

b.打开百度首页

c.点击firebug的选择元素按钮后，再点击百度的上部链接,自动定位到firebug的css源码的相应位置，右侧显示该样式的具体内容，修改也在这里进行

3.网络状况监视器–查看拖慢网络的元素

a.F12调出firebug,点击网络

b.打开百度首页

c.firebug先清除一下之前的残留，ctrl+F5强制刷新百度，查看firebug的网络内容，看哪个元素下载时间长，可以考虑将其删除或修改

4.Javascript调试器

主要开发人员使用