在Javascript控制台中控制Chrome Web Inspector？

Question

无论如何，是否可以在JavaScript控制台中控制Chrome Web Inspector？

例如，假设我想在“元素”面板中选择一个元素（#test_element）。 通常，我右键单击该元素，然后选择“检查元素”。

我想在JavaScript控制台中执行以下操作：

webInspector.inspectElement("#test_element");

我希望能够以这种方式访问​​Web检查器的整个UI。 我也愿意为此使用扩展。

Answer 1

为此使用inspect 。 由于要使用选择器，因此请将其与控制台的$ ^{别名结合用于document.querySelector} 。 如果页面重写$ ，因为它使用jQuery，则使用$$(selector)[0]获取对DOM元素的引用（只要它是对DOM节点的引用，任何操作都可以）。

Answer 2

从命令行Api参考

inspect(object)

在适当的面板中打开并选择指定的元素或对象：DOM元素的Elements面板和JavaScript堆对象的Profiles面板。

以下示例在“元素”面板中打开document.body的第一个子元素：

 inspect(document.body.firstChild);