适用于Chrome的Firebug

cod*_*pro 2 javascript browser debugging ajax google-chrome

任何人都可以向Google Chrome推荐与Firebug类似的合适扩展程序吗?我确实看到在这里有几个类似的问题,但答案似乎很过时.

谢谢!

RoT*_*oRa 22

它是内置的.按Ctrl+ Shift+ I.(或菜单中的工具>开发人员)

  • @coderpros:嗯?A)你的问题中没有提到你明确在哪里寻找AJAX跟踪和2)Chrome Dev Tools跟踪"资源"下的AJAX请求和"脚本"下的脚本调试. (5认同)
  • @coderpros:Chromes"Resouce"标签与Firebugs"Net"完全一样.如果你正在寻找一个确切的功能,那么这样说而不是徘徊. (4认同)
  • @coderpros以什么方式不"支持像ajax这样的东西".我每天都在使用它. (3认同)

dar*_*ioo 6

你可以使用firebug lite.但Chrome已经拥有了不仅仅是不错的开发者工具.

  • 谢谢你的接受,但我认为RoToRa比我更值得. (2认同)

Che*_*hev 5

Chrome的开发者工具在过去一年中取得了很大进展.调整了一段时间,我一直感到困惑,所以我在盒子上开发了一个测试页面,我将它们并排放置,左侧显示器上的firebug和右侧的dev工具.

我经历了并确切地知道它们是如何不同的.我稍后意识到,Chrome与Firebug的组织方式略有不同.事实证明,在我习惯之后,我比开发工具更喜欢萤火虫.

  1. 我曾经对开发工具的元素部分抱怨很多,但现在它似乎与firebug几乎完全相同.我可以快速单击以检查元素,它可以正确扩展节点,将我带到我想要的节点.

  2. The resources tab in dev tools blows the net tab in firebug out of the water. I think it's way better organized. You get a preview of the images in the resources list and you can actually see which elements are transparent because chrome places the checkerboard behind the image (you do get a preview of the image in firebug but only when hovering over the request node, kind of annoying). Also, you can double-click resources and chrome will pop them up in a new tab, VERY nice for when I'm debugging AJAX calls and need to see the formatted exception error in the browser without manually typing in my ajax URLs.

  3. 行号.在firebug中查找行号是非常困难的,你不能对某些内容这样做.每次查看DOM,CSS,脚本等时,您都会在左侧获得全面的行号规则.firebug唯一的地方是脚本部分.

  4. firebug和dev工具都有一个全面的javascript调试器.但是,无需在开发工具中删除断点即可停用断点非常有用,我会不断使用它.你可以在萤火虫中做到这一点,但是你必须在每个断点处取消一个盒子,这很烦人.

  5. 我喜欢JSONObjects只是作为资源与其他所有内容一起出现而不是拥有自己的部分.它可以让您轻松快速查看正在发生的事情.


据我所知,其他一切看起来都是一样的.我真的找不到任何firebug比开发工具更好的东西.通常当我认为开发工具缺乏firebug的功能时,事实证明它只是在不同的地方或以不同的方式实现.两者都有一个全面的控制台显示 两者都支持将工具弹出到单独的窗口中.两者都支持多个选项卡的多个实例.Chrome甚至还有额外的功能.检查存储的能力,如缓存,cookie等.开发工具似乎为我赢得了胜利.

如果你想要一个优秀的chrome调试器,我强烈建议熟悉使用扩展的开发工具.

对不起我的回答太久了.我可能会在某个时候写博客做一个更全面的比较.