Firefox的目标之一就是尽可能地使web开发者的生活更简单高效,并通过提供工具和具有很强扩展性的浏览器使人们创造出神奇的东西。使web开发者使用Firefox的时候,浏览器可以提供大量开发工具和选项。本文将这些工具做了简单整理。
Firebug
迄今为止,最知名的web浏览器的web开发工具就是Firebug扩充套件。毫无疑问,在很长的一段时间,它把怎么进行开发和调试作为自己的门槛。Firebug是一个有很多强大的功能的重要工具,包括很多扩展。
Firefox为web开发提供的扩展
多年来,Firefox开发了许多扩展来帮助web开发者最大化利用Firefox。用得最多最有名的是下面列出来的这些。如果我们漏掉了对你有帮助的扩充套件,请一定告知我们。
web开发者提供测试web资源的辅助功能。
All in one Sidebar
AiOS允许你打开多个窗口作为侧栏面板,并能够在他们之间快速切换。AIOS结束了窗口混乱的时代,除了书签和历史记录外,它还在侧边栏增加了下载,加载项和其他的一些对话框。
Cache Status
使用它来对缓存进行监督和管理。
CacheToogle
通过点击开关,禁用浏览器的缓存。
Colorzilla
高级取色器,颜色选择器,渐变颜色生成器,和其他的一些进行颜色处理的工具。
Console⊃2;
Console⊃2;可能会成为下一代的错误控制台,用来取代JavaScript控制台。
从火狐v0.5开始就有控制台过滤扩展套件,之前该套件只在Console⊃2;网站上可用。
CSS Reloader使你能够重新加载网站的CSS,而需要重新加载网页。
DOM Inspector用来观察,编辑web文件或XUL应用正在使用的DOM。可以通过一个显示文件和节点的不同视图的两个小窗口拼起来的大窗口来查看DOM。
该插件用来编码Firefox中的视频和音频。用Firefogg吧大部分的媒体文件编码成Ogg和WebM。Firefox提供接口用来整合编码上传的程序。
FireFTP是一个免费,安全,跨平台的一个Mozilla FirefoxFTP/SFTP客户端,该客户端为访问FTP/SFTP提供简单直观的途径。
JavaScript Unit测试扩充套件。
显示水平和竖直的不定浮动指南,与你在Photoshop使用到它的方式一样。有助于改进布局,将元素放在恰当的网格中,系统地放置元素,使设计更结构化。
FoxyProxy是一个高级代理管理工具,它完全替代了Firefox的有限的代理性能。跟SwitchProxy相比,它提供更多的功能。
地理定位您需要的位置。
通过Javascript自定义网页的显示方式和行为。
HTMLValidator是个Mozilla扩充套件,它在Firefox和Mozilla中添加了HTML验证。HTML页面中的错误数量通过窗口上的按钮来显示。
一个用于Firefox的HTTP分析器插件
自动化火狐浏览器。记录和重现重复的工作。如果你喜欢Firefoxweb浏览器,但是厌倦了重复的工作,比如说每天访问同样的站点,填写重复的表格,还要记住密码,那么Firefox的iMacros就是你梦想的解决方式。
Monitor Jenkins(http://jenkins-ci.org)创建和显示Firefox状态栏中的状态。
嵌入在浏览器中的jQuery and jQuery UI
使浏览器中的JSON的内容更容易阅读。
在浏览器中查看JSON文档。
如果你浏览的网站包含外部的js/css文件,会出现一个有“SS”,“JS”或者两者都有的按钮,每个单独的文件都可以通过点击文件名进行查看。文件将会在一个新的窗口打开。
通过给第一页,前一页,下一页,最后一页提供工具栏按钮来简化了页面序列的导航(比如,Web漫画,论坛,或者技术规范如HTML4建议)。
在浏览网页时查看HTTP标头。
当文件变化时,LiveReload就会更新网页。
在网页上画一个尺子来查看宽度和高度或者以像素为单位对齐网页元素。
添加、修改、过滤发送到web服务器上的请求头。这个加载项尤其适用于移动web的开发,HTTP测试和隐私保护。
通过这个套件你可以获得web浏览器中最好的安全性能,它只允许你信任的网站播放动态内容,而且保护你免受XSS和Clickjacking的攻击。
PageSpeed 是开源的,最早出现在Google上通过分析网页性能最佳实例来帮助开发者优化他们的网页。
PixelZoomer可以获取当前网站的截屏,并提供多个工具进行像素分析。利用这个工具你可以放大网页(最大可以放大32倍),测量距离,和获取颜色。
使用Pixlr Grabber使抓屏和从网页上抓取图片变得更容易。使用PixlrGrabber加载项,你只需要点击一下右键就可以复制,保存,分享,甚至可以编辑你抓取的图片或背景
这是一个开发者工具栏,用来跟web服务和其他web资源进行交互,允许你发出HTTP请求,设置实体主体和内容类型。Poster允许你与web服务进行交互并检视结果。
在状态栏和(或)工具栏中快速启用和禁用Java,Javascript,Flash,Sliverlight,Images,Stylesheets,he Proxy,而不需要打开任何对话!
Web开发的颜色工具。选色,取色+保存颜色,并拖放这些颜色来尝试调配颜色。
正则表达式的测试工具(用高亮色显示(包括子匹配))和新建表达式的助手。
这是一个非常简单的扩展套件,用来移除所有的正在打开网站。它在你的网页右键菜单中添加了一个选项,和一个清除Cookies按钮来完成操作,并在状态栏显示操作的状态。
只要点击一下,你就可以捕获,抓取,保存,下载或者复制你在web浏览器上看到的任何东西。Screenshot pimp是迄今为止最具有自主定义性和用户友好的屏幕捕获工具栏,这个工具栏能在Windows和Mac上使用。
管理你电脑上的SQLite数据库。
只需要一个简单的工具栏按钮就可以打开SeleniumIDE。你需要先安装SeleniumIDE:http://seleniumhq.org/projects/ide/
Seoquake是Firefox 的一个SEO套件,其主要目的是帮助网管优化搜索引擎,优化社交媒体,和Internet推广。Seoquake允许研究许多重要的SEO参数。
在状态栏中显示当前网页的IP地址。它也允许通过IP查询用户信息服务(右键)和主机姓名(左键)。另外,你可以把IP地址拷贝到粘贴板。
用Stylish重设网页的样式,它是一个用户样式管理器。Stylish允许你很容易就可以为Google,Facebook,YouTube,Orkut和许多其他网站安装主题和皮肤。你甚至可以自定义Firefox和其他程序。
用tempdata访问修改HTTP/HTTPS表头和发送参数。
如果你想查看网站的可访问,只要点击这个按钮就可以做到。
基于WebGL的网页3D视觉效果。
该套件对网页执行一系列的验证操作。这种多重验证包括外部,内部,本地网页验证,本地网页验证是通过一个从http://www.totalvalidator.com/downloads/extensiontool.html获得的桌面工具本地的拷贝进行的。
TryAgain一直在尝试着在无法连接服务器的时候加载网页。
UserAgentSwitcher扩充套件添加了一个菜单和工具栏按钮,用来切换用户代理。
Wapplayer是一个浏览器加载项,该加载项用来显示用在网站上的技术。
WebDevelop扩充套件给浏览器添加了许多web开发工具。
Firebug extensions
在一些特殊的用例中用到一些Firebug的扩充套件,下面将列出其中的一部分:
用Ace突出显示Firebug的命令行。
Code Coverage v2 for Firebug 0.1
这个Firebug扩充套件用来记录Javascript代码的覆盖率。
Firebug 中能够查看使用了哪些CSS规则的扩充套件。
Firecookie是Firebug的一个扩充套件,该套件能够查看,管理你的浏览器里的cookies。
找到与选中的CSS选择器或者Xpath表达式匹配的HTML元素。
FirePHP允许你调用一个简单PHP方法将日志写入Firefox控制台。
Firebug为jQuery开发提供的插件。
使Firebug更友好更简单易用。
Inline Code Finder for Firebug
Inline Code Finder 是Firebug的一个加载项,能够发现HTML元素中的一些问题:内联的 Javascript事件,内联的样式,是在链接的href属性中直接编写javascript代码。
突出显示Firebud的Javascript的语法。
NetExport是Firebug的扩展,该扩展允许输出所有NetPanel收集和计算的数据。已创建的文件使用HTTP文档格式(基于JSON)。
PixelPerfect是Firefox/Firebug的一个扩展,这个扩展允许web开发者和设计者用web组件轻松覆盖原来的HTML的头部.
YSlow分析网页,并根据Yahoo!为高性能网站提供的规则来分析网站为什么运行缓慢。
常用组件
Firebug
用鼠标手势执行命令
(Wappalyzer )
Wapplayer是一个浏览器加载项,该加载项用来显示用在网站上的技术。
Adblock Plus 让您重新取得 Internet 的控制权和您查看网页的方式,广告已成往事