将dom元素从后台脚本传递给chrome.tabs.executeScript

时间:2013-08-22 18:07:02

标签: google-chrome google-chrome-extension

当我从后台脚本单击上下文菜单到通过chrome.tabs.executeScript调用的脚本时,我正在尝试传递活动的dom元素。我可以通过布尔和字符串,但是当我传递dom元素时,我总是会出错。我开始认为这是不可能的。

//doScripts function called from browser action
chrome.browserAction.onClicked.addListener(function(tab) {
    doScripts(true, null);
});

//doScripts function called from context menu click
function getClickHandler(info, tab) {
    var currTarg = document.activeElement;
    console.log("currTarg = " + currTarg);
    doScripts(false, currTarg); 
}

//i reference doingBrowserAction and contextTarg in myscript.js
function doScripts(context, targ){
    chrome.tabs.executeScript(null, {code: "var doingBrowserAction = "+context+"; var contextTarg = "+targ+";"}, function(){
        chrome.tabs.executeScript(null, {file: "js/myscript.js"}, function(){
        //all injected
        });
    });
}
//setup context menu
chrome.contextMenus.create({
  "title" : "DESTROY!",
  "type" : "normal",
  "contexts" : ["page","selection","link","editable","image","video","audio"],
  "onclick" : getClickHandler
});

我在myscript.js中引用了doBrowserAction和contextTarg。我知道我想要做的事情是可能的,因为adblock扩展会做到这一点,但很难搞清楚如何做。提前谢谢。

1 个答案:

答案 0 :(得分:2)

您无法从后台页面直接引用内容脚本的DOM元素,因为后台页面在扩展程序的进程中运行,内容脚本在选项卡的进程中运行。另请参阅https://code.google.com/p/chromium/issues/detail?id=39507

后台页面中的document.activeElement属性引用后台页面文档中的活动元素。可以想象,这个值毫无用处。

如果查询当前右键单击元素的状态,请在内容脚本中绑定事件。在下一个示例中,我选择了contextmenu事件,因为也可以通过键盘打开上下文菜单。

此示例添加了一个上下文菜单选项,用于从文档中删除最后一个活动元素。

// content script
var lastElementContext;
document.addEventListener('contextmenu', function(event) {
    lastElementContext = event.target;
}, true);
chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
    if (lastElementContext && lastElementContext.parentNode) {
        lastElementContext.parentNode.removeChild(lastElementContext);
        lastElementContext = null;
    }
});

后台脚本:

chrome.contextMenus.create({
    title: 'DESTROY!',
    contexts: ['page', 'link', 'editable', 'image', 'video', 'audio'],
    onclick: function(info, tab) {
        chrome.tabs.sendMessage(tab.id, 'doDestroy');
    }
});