chrome 扩展中选项卡更改时的页面内容

Question

background.js

var htmlcontent = null;

chrome.tabs.onUpdated.addListener(function() {
onWindowLoad();
alert(htmlcontent);
});

chrome.tabs.onHighlighted.addListener(function(){
onWindowLoad();
alert(htmlcontent);
});

function onWindowLoad() {
chrome.tabs.executeScript(null, {
file: "getPagesSource.js"
}, function() {
if (chrome.extension.lastError) {
htmlcontent = 'There was an error injecting script : \n' + chrome.extension.lastError.message;
}
});
}

chrome.extension.onMessage.addListener(function(request, sender) {
if (request.action == "getSource") {
htmlcontent = request.source;
}
});

getPagesSource.js

function DOMtoString(document_root) {
return document.body.innerText ;
}

chrome.extension.sendMessage({
action: "getSource",
source: DOMtoString(document)
});

我正在开发一个 chrome 扩展。我能够在重新加载时获取当前窗口的正文内容，但在更改选项卡时无法获取内容。上一个选项卡的内容正在保存。我是否使用了错误的 API？或者当我在 Chrome 中更改标签时如何触发 onUpdate 功能？

Answer 1

终于找到了。

我正在打印 chrome.tabs.onHighlighted.addListener(function() 中的 html 内容。那一刻，我仍然没有得到值。

htmlcontent 的值只会在 chrome.extension.onMessage.addListener(function().

因此，如果您尝试打印 html 内容，您仍然会拥有上一个选项卡的内容。

所以流程是，

chrome.tabs.onUpdated.addListener(function() {
onWindowLoad();
});

function onWindowLoad() {
chrome.tabs.executeScript(null, {
file: "getPagesSource.js"
}, function() {
if (chrome.extension.lastError) {
htmlcontent = 'There was an error injecting script : \n' +     chrome.extension.lastError.message;
}
});
}

chrome.extension.onMessage.addListener(function(request, sender) {
if (request.action == "getSource") {
htmlcontent = request.source;
//call whatever function from here on so that htmlcontent will have the selected tab's content.
}
});

Answer 2

“当我更改选项卡时”是指更改哪个选项卡处于活动状态？

确保您了解选项卡 API 中事件和回调的参数： http://developer.chrome.com/extensions/tabs

我不确定您要做什么，但是当您更改哪个选项卡处于活动状态时会触发 tabs.onActivated 事件。也许您想为此添加一个侦听器而不是 tabs.onHighlighted。

另外，chrome.tabs.executeScript 的第一个参数应该是您要在其中执行脚本的选项卡的选项卡 ID（如果为 null，它将在活动选项卡中执行）。选项卡事件的回调具有附加参数，例如选项卡在哪个窗口中，或者选项卡是否仍在加载或已完成。