Chrome扩展将节点引用从内容脚本传递到DevTools页面

我有一个简单的扩展,它使用devtools页面提供调试功能。单击browserAction图标时,该页面将在当前选项卡中插入内容脚本。如何将DOM节点(或nodeId)从内容脚本传递回devtools页面,以便 inspect() 可以打电话吗?

manifest.json包含:

"devtools_page": "devtools.html"

devtools.html包含:

<script src="devtools-script.js"></script>

devtools-script.js:

chrome.browserAction.onClicked.addListener(function(tab) {
    chrome.tabs.executeScript(tab.id, {
        file: 'js/content.js'
    }, function () {
        chrome.devtools.inspectedWindow.eval('window.searchedElement', {
            useContentScriptContext: true
        }, function (result) {
            console.log('resulting element:', result);
        });
    });
});

content.js:

window.searchedElement = document.body;

(我用过 document.body

现在,当我导航到一个页面,打开DevTools并单击扩展时,会发生以下情况:

1. DevTools打开my DevTools.html页面(打开DevTools时,单击之前)
2. My devtools页面插入我的内容脚本(单击后)
4. DevTools页面执行以下操作: eval() 返回以前由内容脚本设置的元素

结果元素:{}

显然,你不能那么容易地通过节点。我可以给元素一个 id

是否有更好的方法从devtools页面访问已检查窗口中的元素?