本文共 8136 字，大约阅读时间需要 27 分钟。
前面的话 作为一个 Web 开发者, 你可能不喜欢针对 FireFox 开发, 因为在国内 IE 的使用者是那么的多, 而针对2个不同浏览器的开发又是件很麻烦的事情. 不过有几个理由使得你应该仔细看完本文: 1, Web 表现越来越标准 无论是 IE 系列还是 FireFox, 浏览器越来越标准化, W3C对于 Web 标准的控制力也越来越强, 随着 DOM, CSS, XHTML 标准的广泛应用, 浏览器间的表现差异会越来越小. 越来越多的网站开始使用 XHTML1.0 的标准开发, 甚至使用 strict 约束开发. 2, Web 开发缺少辅助调试工具 Web 开发最麻烦的地方在于调试器和辅助工具, 无论是修改一个显示不正常的样式, 还是调试一大段 JS 代码, 都很让人头疼, 耗时耗力. 本文将介绍一些重要的 FireFox 插件，它们将对开发 Web 服务提供强大的浏览器端调试工具。FireFox 和扩展插件 FireFox 是 NetScape 放弃商业浏览器 NetScape Navigator 后投入的一个开源的项目。 (不知道有多少人使用过 NetScape 1.x, 2.x, 3.x, 也不知道有多少人还知道 Mosaic...) 总之 FireFox 在 IE 长期垄断市场后异军突起，以其良好的性能，高扩展性赢得了很多青睐(尤其是技术爱好者)。 FireFox 支持扩展插件，所以你可以在 FireFox 上增加各种功能，比如听 MP3，FTP文件，甚至把浏览器变成 Web Server。 FireFox 的官方网站 FireFox 的扩展插件 下面是我从几百个开发相关的插件中精选出来的好用插件。------------------------------ 开发工具 ------------------------------ Web Developer by Chris Pederick Adds a menu and a toolbar with various web developer tools. Version 1.1.4 — June 5, 2007 说明: 超强的 web 分析工具, 开发人员必装. Firebug 1.05 Homepage Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page... Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page. Visit the Firebug website for documentation, screen shots, and discussion forums: 说明: 查看, 编辑, Debug 页面的 CSS, HTML, JavaScript. 超强的开发调试的工具, 开发人员必装. View Source Chart 2.5.03 * Draws A Color-Coded Chart of a Web Page's Source Code 说明: 显示非常好看的源码, 分级缩进, 不同颜色区分. Tamper Data 9.8.1 Use tamperdata to view and modify HTTP/HTTPS headers and post parameters. 说明: 查看 firefox 收发请求的 header, 特别是在发出请求前, 可以修改 header. 非常好的工具. Console2 0.3.7 Console2 let's you display errors filtered by type (Errors, Warnings, Messages), language (JavaScript, CSS, XML) and context (Chrome, Content). Furthermore it provides a simple search box (as seen in the History and Bookmarks sidebars), hiding of duplicates, sidebar optimizations, a customizable toolbar and some more accessibility improvements. 说明: 检查页面上的各种错误, JavaScript, CSS, XML. JavaScript Debugger 0.9.87 Venkman is the code name for Mozilla's JavaScript Debugger. Venkman aims to provide a powerful JavaScript debugging environment for Mozilla based browsers. 说明: firefox 环境下的 JavaScript Debugger, 强大的脚本调试工具. Live HTTP Headers 0.13.1 View HTTP headers of a page and while browsing. 说明: 浏览页面同时记录所有 HTTP headers . Add N Edit Cookies 0.2.1.2 Cookie Editor that allows you add and edit "session" and saved cookies. 说明: 查看并且修改 cookies, 不方便的地方是显示所有浏览器的 cookies 而不仅是当前页. XPath Checker 0.4.1 An interactive editor for XPath expressions. Choose 'View XPath' in the context menu and it will show the editor. You can edit the XPath expression and it incrementally updates the results. 说明: 据说可以调试 XPath, 没有顾上测试.------------------------------ HTML 验证 ------------------------------ HTML Validator (based on CSE HTML Validator) 1.2.3 Validates HTML documents using the CSE HTML Validator engine for Windows. Requires CSE HTML Validator for Windows. The lite edition is available for free at 说明: 著名的 CSE HTML Validator 引擎, 不过需要先安装 CSE HTML Validator Lite (Lite 版本是免费的). Relaxed the HTML Validator 0.9.2 Homepage "Relaxed" is a HTML validator which validates HTML documents using it's own schema definitions written in Relax NG with embedded Schematron patterns. 说明: 直接在当前页面上作 HTML validation, 界面不错, 更加清晰直观. Html Validator 0.8.3.9 HTML Validator is a Mozilla extension that adds HTML validation inside Firefox and Mozilla. The number of errors of a HTML page is seen on the form of an icon in the status bar when browsing. The details of the errors are seen when looking the HTML source of the page. 说明: 当浏览页面时, 状态栏中将显示页面错误信息, 可以通过查看源码来了解这些信息. 使用 tidy 和 OpenSP (SGML Parser) 分析页面. Total Validator by Andy Halford Perform multiple validations and take screen shots in one go. This 5-in-1 validator works with external, internal, or local web pages using the Total Validator service or local copy of the Pro desktop tool... Version 4.1 — June 30, 2007 说明: 将把当前页面在 做 HTML validation, 输出结果用红字进行了语法修正, 比较友好, 不过由于通过其他网站验证, 速度有点慢, 并且结果不易保存.------------------------------ 页面设计相关 ------------------------------ MeasureIt 0.3.6 Draw out a ruler to get the pixel width and height of any elements on a webpage. 说明: 可以测量页面上任何选择区域的长宽, 对界面设计人员非常有帮助. MetaTags 2.3.5.2 This sidebar displays page meta-information (metatags, links, etc.) Has automated search engine submission menu. Features include: Watches currently loaded Web page and automatically updates the sidebar. Displays metatags, links, language, base... 说明: 在左侧显示 HTML Head 里的各种信息. ColorZilla 1.0 Advanced Eyedropper, ColorPicker, Page Zoomer and other colorful goodies. 说明: 从页面, 或者调色板上取色, 同时可以缩放页面.------------------------------ SEO 广告相关 ------------------------------ RankQuest SEO Toolbar by Vincent Brown RankQuest SEO(Search Engine Optimization) Toolbar provides you quick access to more than 30 intuitive SEO tools. Alexa Rank and Page Rank provided by Alexa and Google respectively ensures the popularity of the site. Once you download and install the SEO Toolbar you are only one or two clicks away from carrying out most of your day to day SEO... Version 3.9.1 — June 7, 2007 说明: SEO 工具插件, 访问一个页面时, 显示此页面的各种排名及 SEO 信息, 可以分析词密度, 但仍然不能正确对中文分词. 比较有用. Adsense Preview 1.0.1 Preview the Google ads that may show on any web page. 说明: 在当前页面上显示 Google ADs 帮助确定广告位置, 不过做的不好, 弹出一个很大的页面窗口, 而不是直接更改了当前页面.------------------------------ 有用工具 ------------------------------ HackBar 1.1.1 Homepage This toolbar will help you in testing sql injections, XSS holes and site security. It is NOT a tool for executing standard exploits and it will NOT learn you how to hack a site. Its main purpose is to help a developer do security audits on his code. If you know what your doing, this toolbar will help you do it faster. If you want to learn to find security holes, you can also use this toolbar, but you will probably also need a book, and a lot of google 
说明: 一个快速对字符串进行各种编码的工具, MD5, Base64, URLencode, URLDecode Document Map 0.6.1 Displays the current page's heading structure in the sidebar, allowing rapid navigation between sections 说明: 提供非常好的页面资源结构信息. IE View 1.3.3 Lets you load pages in IE with a single right-click, or mark certain sites to *always* load in IE. Useful for incompatible pages, or cross-browser testing. 说明: 点右键可以选择在 IE 中打开页面, 有助于跨浏览器调试. TimeStamp Converter 1.3.5 Converts dates and timestamps. Context menu option to convert the selected timestamp into a date. 说明: 除去从上下文中转换, 还可以手动将 timestamp 时间戳与 date/time 转换 TimestampDecode 0.1.4 Treats the selected number as a timestamp and displays a decoded date/time 说明: 将选中的数字作为 timestamp 时间戳转换为 date/time Fire Encrypter 3.0 FireEncrypter is an Firefox extension which gives you encryption/decryption and hashing functionalities right from your Firefox browser, mostly useful for developers or for education & fun. The new FireEncrypter is ready! (v-3.0, this version contains the following ciphers: - AES (Rijndael 128Bit) - Affine - Caesar - XOR - OTP (One Time Pad) - Vigenere - Rail Fence - Morse Encoder - MD2 Hashing - MD5 Hashing - SHA1 Hashing - SHA256 Hashing - SHA384 Hashing - SHA512 Hashing - Secure password generator. 说明: 将文字加密成各种算法的密文, 甚至包括摩尔斯码. All-in-One Sidebar 0.7.1 All-in-One Sidebar (AiOS) is an award-winning sidebar control, inspired by Opera's. It lets you quickly switch between sidebar panels, view dialog windows such as downloads, extensions, and more in the sidebar, or view source or websites in the sidebar. Click on the left edge of your browser window to open the sidebar and get easy access to all your panels. 说明: 在浏览器左侧增加打开 书签, 历史, 插件 等的工具条. extEMM 2.0 This extension adds a menu button to Firefox allowing the user to restart or close Firefox and re-open with the current tabs. The session is even saved through a reboot. This is a small extension that uses Firefox's internal session save features, light and fast. 说明: 重启 Firefox , 不但会保留书签还会保留 session.
转载地址：http://bdmbi.baihongyu.com/