Firefox 开发工具

创新

网页与网页应用的开发工具。

Scratchpad

一个集成在Firefox中的，用于编写与执行JavaScript的文本编辑器。

Style Editor

预览或编辑在最新页面中的CSS（层叠样式表单）。

Shader Editor

使用WebGL预览或编辑vertex与fragment shaders。

探索与调试

检查或是探索网页或网页应用。

网络控制台

查看记录在网页上的记录，并使用JavaScript与网页进行互动。

页面查看器

查看与修改HTML信息及CSS。

JavaScript调试工具

中断，逐步运行，检查并修正在页面上运行的JavaScript。

网络监视器Monitor

在网页加载时观察网络需求。

开发者工具栏

用于启动开发者工作的命令按钮组合。

3D 视图

页面的3D可视化工作。

Eyedropper

从页面中选择一种颜色。

移动平台

移动平台上的开发工具

应用管理

Design and develop apps for Firefox OS.

Firefox OS 模拟器

Run and debug your Firefox OS app on the desktop, without needing a real Firefox OS device.

Responsive Design View

See how your website or app will look on different screen sizes without changing the size of your browser window.

调试Firefox(Android)

Connect the developer tools to Firefox for Android.

性能

Diagnose and fix performance problems.

JavaScript 分析器

Figure out where your JavaScript code is spending its time.

动画绘图工具

Highlights the parts of the page that are repainted in response to events.

事件查看器

See reflow events in the web console.

网络状况表现

See how long the parts of your site take to load.

为浏览器找出漏洞

By default, the developer tools are attached to a web page or web app. But you can also connect them to the browser as a whole. This is useful for browser and add-on development.

浏览器控制台

See messages logged by the browser itself and add-ons, and run JavaScript code in the browser's scope.

浏览器工具箱

Attach the Developer Tools to the browser itself.

Extending the devtools

The developer tools are designed to be extensible. Firefox add-ons can access the developer tools and the components they use to extend existing tools and add new tools. With the remote debugging protocol you can implement your own debugging clients and servers, enabling you to debug websites using your own tools or to debug different targets using the Firefox tools.

Remote Debugging Protocol

The protocol used to connect the Firefox Developer Tools to a debugging target like an instance of Firefox or a Firefox OS device.

Source Editor

A code editor built into Firefox that can be embedded in your add-on.

The Debugger Interface

An API that lets JavaScript code observe the execution of other JavaScript code. The Firefox Developer Tools use this API to implement the JavaScript debugger.

网站开发工程师

Firebug

A very popular and powerful web development tool, including a JavaScript debugger, HTML and CSS viewer and editor, and network monitor.

DOM Inspector

Inspect, browse, and edit the DOM of web pages or XUL windows.

Adds a menu and a toolbar to the browser with various web developer tools.

网页制作工具

A set of tools developed by Mozilla, aimed at people getting started with Web development.

W3C Validators

The W3C website hosts a number of tools to check the validity of your website, including its HTML and CSS.

JSHint

JavaScript code analysis tool.