firebug firebug的说明!

《firebug firebug的说明!》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、Firebug入门指南作者：EstelleWeyl译者：阮一峰本文是Firebug的一个概览，并不对它的所有特性进行详尽解释。不过，本文的内容对一个新手来说，应该是足够了。目录一、安装Firebug二、打开和关闭Firebug三、Firebug窗口概览四、随时编辑页面五、用Firebug处理CSS六、盒状模型七、评估下载速度八、DOM九、Javascript调试十、AJAX十一、附注一、安装FirebugFirebug在Firefox浏览器中运行。另外有一个Firebuglite版本，可以通过javascript调用，包含在页

2、面中，从而在其他非Firefox浏览器中使用。本文不涉及这个版本。安装Firebug，请访问Firebug下载页面。点击该页面右边栏中部巨大的橙黄色按钮即可。你也可以在Mozilla的FireFoxAdd-ons站点下载它。安装后只要重新启动FireFox，就可以使用了。如果你已经安装过了，那么请检查是否更新到了最新版本。打开Firefox的“Tools”菜单，选择“Add-ons”命令，然后在弹出窗口中点击左下角的“FindUpdates”按钮。二、打开和关闭Firebug在Firebug网站上，可以找到它的快捷键设置。我最

3、常使用以下三种方法：*打开Firebug：按F12，或者点击浏览器状态栏右边的绿色标志。 *关闭Firebug：按F12，或者点击浏览器状态栏右边的绿色标志，或者点击Firebug窗口右上角的红色关闭标志。*在单独窗口中打开Firebug：点击firebug窗口右上角的红色箭头标识，或者使用Ctrl+F12/⌘+F12按钮。Firebug的相关设置：*固定Firebug在新窗口打开：先打开firebug，点击左上角的bug标志，选择options菜单中的“AlwaysOpeninNewWindow”设置。*增加/缩小字体大小：

4、先打开firebug，点击左上角的bug标志，选择“TextSize”命令。每次字体变化的幅度非常小，你可能需要使用多次。 *限制只对某些站点使用Firebug：先右击浏览器状态上的greencheckmark标志，选择“disableFirebug”命令。然后，再右击这个已经变灰的标志，选择“AllowedSites...”命令，增加允许Firebug生效的域名。 三、Firebug窗口概览*Console标签：主要使用javascript命令行操作，显示javascript错误信息，在底部的>>>提示符后，你可以自己键入j

5、avascript命令。*HTML标签：显示HTML源码，并且像DOM等级结构那样，每行之前有缩进。你可以选择显示或不显示某个子节点。*CSS标签：浏览所有已经装入的样式表，可以当场对其修改。在Firebug窗口上部，“edit”命令的旁边，有一个本页面中所有样式表的下拉列表，你可以选择一个样式表进行浏览。 *Script标签：显示javascript文件及其所在页面。在Firebug窗口上部，“inspect”命令的旁边，有一个本页面中所有Javascript文件的下拉列表，你可以选择一个进行浏览。你可以在javascrip

6、t命令中，设置断点（breakpoint）及其出现的条件。*DOM标签：显示所有的页面对象和window物体的属性。因为在javascript中，所有变量都是window物体的属性，所以Firebug会显示所有变量和它们的值。*Net标签：显示本页面涉及的所有下载，以及它们各自花费的时间，各自的HTTP请求头信息和服务器响应的头信息。XHR标签对AJAX调试很有用。四、随时编辑页面在HTML标签中，点击窗口上方的“inspect”命令，然后再选择页面中的文本节点，你可以对其进行修改，修改结果会马上反应在页面中。 Firebug

7、同时是源码浏览器和编辑器。所有HTML、CSS和Javascript文件中的对象，都可以用单击或双击进行编辑。当你输入完毕，浏览器中的页面立刻会发生相应变化，你可以得到瞬时反馈。DOM浏览器允许你对文档结构进行彻底的编辑，不局限于文本节点。在HTML标签中，点击窗口上部“inspect”命令旁边的“edit”命令，下方的窗口就会立刻变成一个黑白的文本编辑窗口，你可以对HTML源代码进行任意编辑。在CSS标签中，Firebug会自动补全你的输入。在DOM标签中，当你按Tab键时，Firebug会自动补全属性名。五、用Firebu

8、g处理CSS在DOM标签中，每个HTML元素的style属性揭示了该元素的所有CSS设置。你可以双击对这些设置进行编辑。 对于那些Firefox不支持的CSS规则，Firebug会自动隐藏。比如，Firebug会隐藏针对某些浏览器的CSS特定设置，以及一些它不支持的CSS3规