Question

我需要修改页面的DOM，但无法找到如何获取当前窗口的元素。

window.onload = function() {
  var bot = document.getElementById('bot');
  bot.style.cursor = "pointer";
  bot.addEventListener('click',function(){
    chrome.tabs.query({
      currentWindow: true,
      active: true
    }, function(tab)  {
      // tab[0] <----- I need to get the elements of the current window to modify
      // for example document.getElementById('element')
    });
  });        
}

Answer 1

我假设您展示的代码在弹出窗口中运行。

要访问现有标签中打开的网页的DOM，您需要Content Scripts。

作为第一步，请参阅此Architecture Overview。

对于一个具体示例，给定一个选项卡ID，您可以注入一个脚本并获取单个值（作为最简单的解决方案），如下所示：

chrome.tabs.executeScript({file: "content.js"}, function(result){
  console.log(result);
});

内容脚本：

// Simplest possible DOM operation
return document.getElementById('element').value;

有关更高级的用法，请参阅上面的文档链接和Messaging文档。

获取当前窗口的所有元素

1 个答案: