在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);