0

单击扩展图标时,我需要获取 Active Tab 的源代码;它需要在新选项卡中可见(因为弹出窗口限制为 800 像素,以及其他原因)。

当我使用弹出窗口时,我对此没有任何问题,但是,我现在想将数据放入新选项卡中。

发生的事情是onClicked回调中使用的targetTab变量包含正确的选项卡信息。但是,一旦打开新选项卡 (popup.html),什么都不会发生;document.body.innerHTML没有改变。

有任何想法吗?

清单.json

{
  "name": "Stock Alert",
  "description": "Create an alert and display streaming stock quotes.",
  "version": "1.1",
  "permissions": [
    "https://www.gwm.ml.wallst.com/",
    "https://*/*",
    "http://*/*",
    "tabs",
    "activeTab"
  ],
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "browser_action": {
    "default_icon": "logo.png"
  },
  "manifest_version": 2
}

背景.js

chrome.browserAction.onClicked.addListener(function(targetTab) {
  chrome.tabs.create({'url': chrome.extension.getURL('popup.html')}, function(tab)
  {
            chrome.tabs.executeScript( 
            targetTab.id,
            {
                code: "document.getElementsByTagName('html')[0].innerHTML;"
            }, 
            function (sourceCode)
            {
                document.getElementById('dump').innerHTML = sourceCode;
            });
  });
});

popup.html(用词不当;这是 onClicked 创建的新选项卡的 url)

<html>
<head>
<title>Stock Tracker</title>
<!--<script src="background.js"></script>-->
<link href="Streamer.css.package.css" rel="stylesheet" type="text/css">
</head>

<body>
<div id="out"></div>
<div id="dump"></div>
</body>
</html>
4

1 回答 1

1

问题是回调函数是在后台页面上下文中执行的。因此,它将尝试<div id="dump"></div>在该页面内而不是在弹出页面内查找。

我一直在摆弄,我想出了以下解决方案。

  1. 点击后,获取当前页面的内容
  2. 将该内容存储在后台页面中
  3. 加载 popup.html
  4. 加载时,从后台页面获取代码内容

背景.js

var myCode;

chrome.browserAction.onClicked.addListener(function(targetTab) {
    chrome.tabs.executeScript( 
    targetTab.id,
    {
        code: "document.getElementsByTagName('html')[0].innerHTML;"
    }, 
    function (sourceCode)
    {            
        myCode = sourceCode;
        chrome.tabs.create({'url': chrome.extension.getURL('popup.html')});
    });
});

popup.html

添加<script src="popup.js"></script>

popup.js

chrome.runtime.getBackgroundPage(function(bg)
{
   document.getElementById('dump').innerHTML = bg.myCode;
});
于 2013-10-02T10:35:59.060 回答