it-swarm.cn

什么是Google Chrome等同于Firebug?

我正在寻找一种可以:

  • 检查HTML元素
  • 管理/调试JavaScript
  • 资料表现
  • 实时修改元素
29
Evan Plaice

它是内置的。页面[纸张] - >开发人员 - >开发人员工具(在Chrome v5及以下)。在v6中可能会有所不同,因为Page按钮似乎在该版本中消失了。

32
Mark Hatton

右键单击 - >检查元素

17
HoLyVieR
13
Emmett

问题问题已经过去4年了。 Chrome(稳定版)现在是版本38.很长一段时间它已经包含了一整套 开发人员工具 大致相当于Firebug for Firefox(尽管偶尔Firefox甚至有a 内置检查员 也是)。

Chrome的开发人员工具允许您执行以下操作:

  • 检查DOM
  • 检查CSS
  • 访问JavaScript控制台
  • 调试JavaScript
  • 查看网络请求,计时和响应
  • 查看渲染,JavaScript和CSS性能
  • 检查本地存储和cookie

可以通过各种方式访问​​开发工具。

  • Chrome菜单 - >工具 - >开发人员工具

  • Ctrl + Shift + I 在Windows或 Cmd + Shift + I 在Mac上

  • F12 在Windows上

  • 右键单击页面上的任意位置并选择检查元素

5
user9877

浏览器中的工具非常适合他们的工作,通常是您最好的首选,但有时他们没有提供有关HTTP请求/响应有效负载的足够技术细节,或者过于特定于页面。

在这些情况下,您可能会发现一个专用的HTTP检查工具,如 Fiddler 或其中一个 Linux替代品 将提供更多洞察力。

如果你真的需要裸机, Wireshark 超越了HTTP到完整的网络流量分析,但一开始就准备好不知所措。

3
JasonBirch

您也可以尝试使用Google的开源Speed Tracer - http://code.google.com/webtoolkit/speedtracer/

Speed Tracer是一种帮助您识别和修复Web应用程序中的性能问题的工具。它可视化从浏览器内部的低级检测点获取的度量标准,并在应用程序运行时对其进行分析。 Speed Tracer以Chrome扩展名提供,适用于目前支持扩展的所有平台(Windows和Linux)。

使用Speed Tracer,您可以更好地了解应用程序的时间花费。这包括由JavaScript解析和执行,布局,CSS样式重新计算和选择器匹配,DOM事件处理,网络资源加载,计时器触发,XMLHttpRequest回调,绘制等引起的问题。

1
mvark