Mozilla Hacks

Firefox 开发者工具节点选择器即将发生变化

Avatar photo 作者 Chris Heilmann

发布于 2014 年 1 月 23 日 分类在 开发者工具 和 Firefox

如果你使用 Firefox 开发者工具，你很快就会看到 页面检查器 组件的节点选择器发生变化。

正如 Bugzilla 上的文档 和 Patrick Brosset 报告的那样，这些变化意味着

  • devtools 中的节点检查按钮从左侧的检查器面板工具栏移到了右侧的工具栏
    new node highlighter position in the devtools

  • 当你将鼠标悬停在标记面板中的节点上时，就会显示高亮显示（而不是必须点击它们）
  • 以前称为“锁定”状态的现在不再存在。这意味着，一旦在标记面板中或通过使用检查按钮并点击页面选择了节点，只要你不选择另一个节点，高亮显示就不会一直显示。这有时会令人沮丧，因为它可能会隐藏你想看到的东西。

你可以在 YouTube 上看到 新功能的实际操作。

这提高了与其他开发者工具的用户交互的兼容性，并且让你更容易在节点之间移动，即使你选错了节点。

你是否希望在 Firefox 开发者工具中看到其他功能？告诉我们，并且 不要犹豫，参与进来并提交错误报告。

关于 Chris Heilmann

HTML5 和开放网络的布道者。让我们一起修复它！

Chris Heilmann 的更多文章…

14 条评论

  1. Bob

    这些工具越来越好！感谢团队及其工作。

    不过，为什么不把检查按钮放在最左边，就像其他工具一样呢？

    2014 年 1 月 23 日 上午 01:49

  2. Hervé Renault

    嗨，我已经将这篇文章翻译成法语了
    http://mozillazine-fr.org/du-nouveau-dans-les-outils-pour-developpeurs-de-firefox/

    2014 年 1 月 23 日 上午 02:09

    1. Robert Nyman [编辑]

      感谢您的翻译！

      2014 年 1 月 23 日 上午 07:00

  3. Delapouite

    似乎在将检查按钮移到主工具栏的过程中，出现了一个非常方便的功能：浏览器工具箱（具有 Chrome 权限的那个）现在能够突出显示工具箱本身的元素。

    这种类似于盗梦空间的行为简化了 Devtools 扩展的调试。感谢 Patrick。

    2014 年 1 月 23 日 上午 02:34

    1. Mike Ratcliffe

      让检查器远程工作是工作中更大的部分，但只有在你远程检查东西时才能看到它。使用浏览器工具箱检查 Firefox 本身、Firefox OS 应用等，是将按钮从检查器工具内部移出的主要原因之一。

      此外，如果将来除了检查器之外的任何其他工具需要选择节点，现在按钮就可以使用了。

      2014 年 1 月 23 日 上午 06:20

      1. Luke

        这意味着浏览器控制台工具也将为 Firefox 和插件提供检查器？

        2014 年 1 月 23 日 上午 08:15

        1. Victor Porof

          是的！以下是如何立即启用它（确保你正在运行 Firefox Nightly）

          1. 按常规方式打开开发者工具
          2. 进入选项面板
          3. 勾选“启用 Chrome 调试”和“启用远程调试”

          现在进入工具中的 Web 开发者菜单，你就会看到浏览器工具箱。这些是针对浏览器运行的开发者工具。

          你很可能现在能够像调试简单的网页一样调试你的插件。如果你不能，请提交错误报告，我们会修复它。

          2014 年 1 月 23 日 上午 09:23

  4. elav

    我喜欢它以前在检查器中的工作方式。现在它非常像 Chromium，我无法忍受，因为当我们标记一个项目时，它不会让我们设置。请不要对错误发表评论。我想创建一个元素，并且它应该保持固定，除非你选择另一个元素。

    我的 5 分钱

    2014 年 1 月 23 日 上午 06:36

  5. Dane MacMillan

    这些开发者工具的进步令人难以置信。锁定状态确实很令人沮丧。几个月前，我提交了一个与之相关的错误报告，并且提到了另一件事：当将鼠标悬停在检查器中相应的节点上时，文档能够滚动到相关区域，或者仅在点击检查器中的节点时滚动到相关文档区域。目前，虚线选择器高亮显示只是在文档区域超出视野时，将自身固定在视窗边界上。

    https://bugzilla.mozilla.org/show_bug.cgi?id=936516

    2014 年 1 月 23 日 上午 08:16

  6. Max

    干得好！
    它可以像 FireBug 一样突出显示边距和填充吗？

    2014 年 1 月 23 日 上午 08:55

    1. Mike Ratcliffe

      这是我们希望在本版本中实现的下一个变化。我们正在等待另一个补丁，并且仍然需要改进框模型突出显示代码，但我们希望它仍然能实现

      http://bugzil.la/663778

      2014 年 1 月 28 日 上午 06:50

  7. thinsoldier

    覆盖层仍然没有显示边距和填充。

    2014 年 1 月 30 日 下午 14:07

  8. Ignatius

    我认为框模型突出显示是我自 Firefox 28 以来打开 Firebug 的唯一原因。希望很快就能看到它！

    干得好！

    2014 年 2 月 8 日 上午 10:37

    1. Mike Ratcliffe

      我只需要修复一些测试，然后我们就可以发布它。

      2014 年 2 月 10 日 上午 03:42

本文的评论已关闭。