Javascript Chrome扩展：connect"；内容脚本“；使用注入DOM

我意识到我们可以通过内容脚本在共享DOM（）上工作

我们可以通过以下方式将注入的DOM内容与内容脚本连接：

element.addEventListener('click',function(){ ourController.fnCallback(); });
// or
element.onclick = ourController.fnCallback;

但当注入的DOM实现如下内容时：

<a href="javascript:ourController.fnCallback();">Click Me!</a>

var ourController = {
    fnCallback: function(){
        // code here
    }
};

"content_scripts": [ {
  "js": [ "content_script.js" ],
  "matches": [ "http://*/*", "https://*/*", "ftp://*/*" ],
  "run_at": "document_start"
}],

此代码直接放在根据清单加载的脚本中，如下所示：

<a href="javascript:ourController.fnCallback();">Click Me!</a>

var ourController = {
    fnCallback: function(){
        // code here
    }
};

"content_scripts": [ {
  "js": [ "content_script.js" ],
  "matches": [ "http://*/*", "https://*/*", "ftp://*/*" ],
  "run_at": "document_start"
}],

---

此问题的解决方案来自文档：

执行环境

内容脚本在称为隔离世界的特殊环境中执行。它们可以访问所注入页面的DOM，但不能访问页面创建的任何JavaScript变量或函数。对于每个内容脚本，它看起来就像在其运行的页面上没有其他JavaScript执行一样。反过来也是如此：页面上运行的JavaScript不能调用任何函数或访问内容脚本定义的任何变量

因此，任何注入的内容都无法使用内容脚本。唯一的解决方案是通过使用内容脚本来使用这样的代码

document.getElementById("elmID").addEventListener('click',function(){
        var data = //get the data from DOM or window state, not from content script
        chrome.extension.sendRequest({
            'request_data': data
        });
    })

它将添加点击事件功能，可以与内容\脚本进行通信