77

根据谷歌的说法，这可以通过在 Chrome 中访问“chrome-devtools://devtools/devtools.html”来完成，但现在在 Chrome（或 Canary）的稳定版本中访问该页面，只显示 99% 的检查器剥离版本.

重申我的“标题”，这是指“检查”检查员。不只是检查一个普通的网页。

虽然我认为没有必要知道解决这个问题，但我正在检查检查员，所以我可以按照 Paul Irish 和这里的讨论来设计它：https ://darcyclarke.me/articles/development/skin-your -铬检查器/

4

4 回答 4

102

按照这些简单的步骤！

  1. 按Command+ Option+ i（在 Windows 上为Ctrl+ Shift+ i）打开 DevTools。

  2. 确保开发人员工具未停靠在新窗口中。您可能必须从菜单中取消停靠：从菜单中取消停靠

  3. 在这个新窗口上再次按Command+ Option+ 。i

  4. 这将在 DevTools 上打开 DevTools。

  • 如果需要，您可以重新停靠页面的 DevTools。
  1. 如果还没有，请选择Elements — 它是检查器顶部的第一个图标。

通过了解Chrome 开发人员工具：远程调试的工作原理，可以找到超出您问题范围的部分，但在理解您遇到问题的原因方面仍然有效。

于 2012-09-05T23:34:11.870 回答
17
  1. 打开 chrome://inspect
  2. 在该页面上打开检查器（cmd + alt + i）
  3. 滚动到页面底部，在该Other部分下单击检查链接

该Other部分中的 URL 应如下所示： chrome-devtools://devtools/devtools.html?doked=true&dockSide=bottom&toolbarColor=rgba(230,230,230,1...

编辑：他们喜欢 chrome:inspect 页面，因此您必须单击左侧的 Other 标题才能使其立即工作。

于 2012-11-26T16:24:39.073 回答
4

我刚刚得到这个工作。关键是您必须在“远程调试”模式下启动 chrome。

在 OSX 上，打开终端窗口并执行以下命令：

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222

在窗户上，它

chrome.exe --remote-debugging-port=9222

（可以在此处找到更好的 Windows 说明：https ://developers.google.com/chrome-developer-tools/docs/remote-debugging#remote ）

这将启动一个 chrome 实例，它将调试消息发送到端口 9222 上的本地网络服务器。

如果您访问该 Web 服务，它将使您能够使用检查器检查正在运行的任何 chrome 窗口。由于我们要检查inspector，我们需要先启动一个inspector窗口（如上使用快捷键；对于Mac它是Command+option+i。）

现在，继续导航到

http://localhost:9222

它将为您提供要在调试器中显示的窗口列表。选择以“开发人员工具”开头的窗口，您将能够检查检查器的 css。

在下图中很难看到，但在左侧，我的 chrome 窗口指向远程调试器，突出显示了工具栏标签之一。在右侧，您会看到工具提示亮起，就像我们在调试网页一样。

检查检查员

于 2012-11-20T20:25:48.690 回答
3

几周前，有人在 stackoverflow 的“javscript”聊天室中指出了这一点。首先，非常重要的是，确保检查器从浏览器窗口中脱离。然后只需打开检查器窗口，然后检查该窗口即可。在 Windows 中CtrlShiftI（编辑：我说过，CtrlShiftI但这会调出控制台来检查控制台......你应该能够来回导航。）用于键盘快捷键。（此处和此处的其他选项和操作系统的其他键盘组合。）只需执行两次即可。

编辑：好的，您可能对取消停靠窗口感到困惑。如果它已停靠，这就是您要单击的内容..在此处输入图像描述

编辑二：我不太确定你为什么不能检查。JDavis 的回答与 Apple 计算机的 Google Docs 一致。如果您使用的是 Linux，它似乎与 Windows 相同。您应该在焦点位于检查器窗口上方时按下检查器组合键。

于 2012-09-05T23:38:52.760 回答