browser - 对有助于开发的浏览器附加工具的建议

Question

谁能推荐一些好的浏览器附加工具/扩展来帮助开发？我在 Firefox 中安装了 firebug，它非常适合处理 CSS、HTML 和 javascript；还有其他建议吗？

萤火虫

score 9 · Accepted Answer

对于火狐：

Firebug非常适合调查和开发。

Web Developer Toolbar也不错。真的有助于 CSS 和页面布局的东西以及更多。

我也使用Live HTTP Headers（我认为它被调用，但它在我的工作机器上，所以现在找不到链接）。这帮助我们解决了缓存问题等问题。

我做了很多手机开发，所以我也使用UserAgent Switcher。对伪装成不同的手机很有帮助。

我倾向于只使用 Firefox 进行开发，并且只在其他浏览器中进行测试，因为大多数浏览器没有 Firefox 那样的广泛的插件来帮助开发。

score 5 · Accepted Answer

火狐：

如果您完全使用 DOM Inspector，请检查此
测量它以告诉您像素距离（如果需要）
IE 视图或Safari 视图，便于在其他浏览器中进行测试
如果您关心验证，HTML 验证器
控制台²改进你的 js 错误控制台
Javascript Shell小书签也很方便（也可以看看其他的）

编辑：这是对其他人提到的Web 开发工具栏的补充

score 2 · Accepted Answer

2

Firefox 的另一个必备工具是 Chris Pederick 的Web Developer Toolbar。

于 2008-08-20T08:11:36.150 回答

score 2 · Accepted Answer

您绝对应该安装 Safari。它内置了许多工具。我一直将它与其他浏览器结合使用。

网络时间线
错误控制台
网络检查员
片段编辑器

此外，它还允许您为您的请求设置用户代理。

考虑一下，它有一个名为Develop的单独顶级菜单。

score 2 · Accepted Answer

在 IE 的情况下，下一个工具可能很有用

Microsoft 开发人员工具栏- dom|styles 查看器
Fiddler HTTP 调试器- http 监视器
即时源- dom|styles 查看器
Companion.JS - dom|styles 查看器，扩展的错误控制台

IE 的“uber”扩展 - “开发者工具”，作为 IE8 的一部分提供

score 2 · Accepted Answer

歌剧有：

蜻蜓（工具 -> 高级 -> 开发者工具）

调试菜单

UserJS 拦截东西的方法

opera:config#CompatMode%20Override 强制怪癖或标准模式

Web 开发人员小部件

您可以查看文件源、编辑它们、应用更改并从缓存重新加载。

score 1 · Accepted Answer

Opera 的开发者控制台和DOM 快照：

http://dev.opera.com/tools/

令人敬畏的是这些是用 JS 实现的书签。糟糕的是，他们需要 Internetz。

score 1 · Accepted Answer

火狐：

如果您完全使用 DOM Inspector，请检查此

测量它以告诉您像素距离（如果需要）

IE 视图或 Safari 视图，便于在其他浏览器中进行测试

如果您关心验证，HTML 验证器

Console2 改进你的 js 错误控制台

Javascript Shell 小书签也很方便（也可以看看其他的）

这是其他人提到的Web Development Toolbar的补充

Cebjyre 的这个列表几乎是完整的（因为问题中已经提到了 FireBug）。我只会添加Tamperdata。有时它非常有用。

score 1 · Accepted Answer

这是我的Firefox 3面向开发的附加组件：

score 1 · Accepted Answer

1

YSlow是一个很好的 Firebug 插件，用于解决页面加载时间问题。

于 2008-11-03T22:12:05.917 回答

score 0 · Accepted Answer

除了已经提到的优秀工具之外，我发现Charles非常有用。特别是因为我使用 Flash Remoting 做了很多工作，它处理得很好。

Charles 是一个 HTTP 代理/HTTP 监视器/反向代理，使开发人员能够查看他们的机器和 Internet 之间的所有 HTTP 流量。这包括请求、响应和 HTTP 标头（其中包含 cookie 和缓存信息）。

Charles 可以充当 HTTP/SSL 通信的中间人，使您能够调试 HTTPS 会话的内容。

它是跨平台的，售价 50 美元，但您可以下载“每次会话 30 分钟”的评估。

score 0 · Accepted Answer

这是我使用的：

火狐：

DOM Inspector：我在 Web 开发中使用它比其他任何东西都多
Launchy : 用于在其他浏览器/应用程序中打开网站
篡改数据：这有助于调试 GET/POST 请求
Web Developer Toolbar：它有很多方便的调试功能：W3C 验证工具、内置标尺、调整大小工具、源代码操作、简单的缓存/css/脚本工具

IE：

Internet Explorer Developer Toolbar : 远不如 Firefox 方便，但至少它为您提供了一个不错的 DOM Inspector

杂项：

Jesse 的方便小书签：shell小书签特别方便
我还安装了Safari和Opera，但大多数情况下只是将它们用于测试和基准测试，因为它们的开发工具不如 Firefox 强大，也不像 IE 那样容易出错。
Lynx：我用它来确保任何 JS 重的网站仍然可以工作，这样我确信它们在谷歌、屏幕阅读器和任何其他类似机器人的应用程序中看起来都不错。

browser - 对有助于开发的浏览器附加工具的建议

12 回答 12

Related

Reference