Firebug工具的介绍与安装

Firebug介绍

Firebug是网页浏览器 Mozilla Firefox 下的一款开发类插件，现属于Firefox的五星级强力推荐插件之一。它集HTML查看和编辑、Javascript控制台、网络状况监视器于一体，是开发JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士军刀，从各个不同的角度剖析Web页面内部的细节层面，给Web开发者带来很大的便利。例如 Yahoo! 的网页速度优化建议工具 YSlow。

Firebug也是一个除错工具。用户可以利用它除错、编辑、甚至删改任何网站的 CSS、HTML、DOM 以及JavaScript 代码。

Firebug官方网址： https://www.getfirebug.com/

Firebug主要功能

网络监视器：Firebug的网络监视器能将页面中的CSS、javascript以及网页中引用的图片载入所消耗的时间以矩状图呈现出来。

Javascript调试器：这是一个很不错的javascript脚本调试器，占用空间不大，但是单步调试、设置断点、变量查看窗口一个不少。

Console 控制台：控制台能够显示当前页面中的javascript错误以及警告，并提示出错的文件和行号，方便调试，这些错误提示比起浏览器本身提供的错误提示更加详细且具有参考价值。

DOM查看器：Firebug的DOM查看器却能方便地浏览DOM的内部结构，帮助你快速定位DOM对象。

查看和修改HTML、 CSS调试及CSS尺标

Firebug安装

安装完毕最新版火狐浏览器，例如Firefox-setup_20.0.1.4847.exe。

点击左上角firefox菜单，选择附加组件，如下图：

Firebug在线安装：

安装完毕最新版火狐浏览器，例如Firefox-setup_20.0.1.4847.exe。

点击左上角firefox菜单，选择附加组件，如下图：

之后在出现的搜索栏中输入“firebug”关键词，出现firebug搜索结果，点击安装后，重启浏览器即可完成安装过程。

Firebug离线安装

安装完毕最新版火狐浏览器，例如Firefox-setup_20.0.1.4847.exe。

在Firebug官方网站上，下载最新版的Firebug安装包。例如： firebug.xpi

打开火狐浏览器，将Firebug安装包拖动到火狐浏览器中。

点击“安装”后，重启浏览器。完成安装！

验证Firebug是否安装成功

安装后，再次打开火狐浏览器。在浏览器的右上角出现Firebug图标：

点击Firebug图标后，浏览器中出现如下界面：

使用Firebug对javascript调试：

打开Firebug界面后，调整到脚本界面：

启用脚本调试：

找到我们要调试的js代码或文件：

增加断点：在行标前，单击鼠标。

去掉断点：在行标前，再次单击。

进行单步调试：

Firebug工具的介绍与安装相关推荐

【软件开发】Eclipse开发工具的介绍、安装及汉化
Eclipse开发工具的介绍和安装一.Eclipse的介绍二.Eclipse的安装 1. 下载Eclipse 2. 运行Eclipse 3. 安装Eclipse的中文语言包 4. Eclipse的 ...
AWVS工具太顶了，漏洞扫描工具AWVS介绍及安装教程
AWVS基本操作 AWVS工具在网络安全行业中占据着举足轻重的地位,作为一名安全服务工程师,AWVS这款工具在给安全人员做渗透测试工作时带来了巨大的方便,大大的提高了工作效率. AWVS工具介绍 Ac ...
Web安全测试工具WVS介绍及安装教程
Acunetix Web安全扫描神器功能 1.登录保护页面的自动扫描一个网站最有可能被攻击和容易受到攻击的区域往往是那些需要用户登录的区域. 因此对的Acunetix最新版本现在可以自动地和轻松浏览 ...
【包管理工具】Windows下的软件包管理工具Chocolatey介绍、安装软件出现错误的解决方法
文章目录 1. Chocolatey是什么? 2. 为什么要使用Chocolatey? 3. 如何下载Chocolatey? 4. 如何使用Chocolatey? 5. 示例一:使用Chocolate ...
saltstack（自动化运维工具）——介绍、安装、部署+远程执行
一.saltstack简介 saltstack是一个配置管理系统,能够维护预定义状态的远程节点. saltstack是一个分布式远程执行系统,用来在远程节点上执行命令和查询数据. saltstack是 ...
漏洞扫描工具AWVS介绍及安装教程
1.AWVS简介 AWVS(Acunetix Web Vulnerability Scanner)是一款知名的网络漏洞扫描工具,通过网络爬虫测试网站安全,检测流行的Web应用攻击,如跨站脚本.sql ...
【转】vs平台工具集介绍，vc6~vs2019各IDE对应的工具集版本
转自:vs平台工具集介绍以及安装 - jack_Meng - 博客园一.什么是平台工具集: 平台工具集其实是MSBuild 其目录所在C:\Program Files (x86)\MSBuild\M ...
【NLP】pyltp工具介绍、安装和使用代码+示例
[NLP]pyltp工具介绍.安装和使用pyltp 文章目录 [NLP]pyltp工具介绍.安装和使用pyltp 1. 介绍 2. 使用 2.1 分句 2.2 分词 2.3 词性标注 2.4 命名实体 ...
如何安装husky_GitHook 工具 —— husky介绍及使用
名称 githooks-Git使用的挂钩.(githook在官网的介绍) 描述如同其他许多的版本控制系统一样,Git 也具有在特定事件发生之前或之后执行特定脚本代码功能(从概念上类比,就与监听事件. ...
logstash+elastic+kibana日志管理工具介绍及安装
logstash+elastic+kibana日志管理工具介绍及安装一. Logstash 安装 1.1 前置条件,安装了官方java 7或更新版本查看 [ldx@1511-min ~]$ jav ...

Firebug工具的介绍与安装

Firebug工具的介绍与安装相关推荐

最新文章

热门文章