Question

我正在为我的老板开发一个Chrome扩展程序，它只是扫描DOM中的短语。

我唯一需要帮助的是用popup抓取DOM内容，我找不到返回当前标签内容的方法。

Answer 1

经过测试并正常工作：

把

"permissions": [
    "tabs"
  ],

在你的清单中

。

然后，在你的background.js

中

chrome.extension.onRequest.addListener(
  function(request, sender, sendResponse) {
    // LOG THE CONTENTS HERE
    console.log(request.content);
  });

chrome.tabs.getSelected(null, function(tab) {

  // Now inject a script onto the page
  chrome.tabs.executeScript(tab.id, {
       code: "chrome.extension.sendRequest({content: document.body.innerHTML}, function(response) { console.log('success'); });"
     }, function() { console.log('done'); });

});

基本上，我们获取当前选项卡，在其上运行一些获取innerHTML的javascript并将其传递给我们。我们会在适当的时候解释回调中的响应。

请注意，这会进行非常少的错误检查，因此您可能希望了解message passing和tabs API。

编辑：我已经尝试过了，它确实按预期工作。要轻松自己尝试，只需创建一个新的空扩展并为其提供“标签”权限和背景页面。然后从chrome：// extensions中检查background.html并转到控制台。复制下面的代码，将chrome.tabs.getSelected嵌套设置为几秒钟的超时。单击“输入”以执行JS时，快速单击其他选项卡。等待你的超时。然后回去检查background.html。您单击的页面的HTML将打印到控制台。

另一个编辑：一般来说，将当前标签DOM作为事件进行访问似乎可能是一个糟糕的模型（这可能就是为什么没有一个很好的本地方式来实现它）。您是否考虑过使用chrome.tabs.onUpdated或content scripts来普遍加载/更改DOM？

Chrome扩展程序：抓取DOM内容进行解析

1 个答案: