Chrome扩展 - Document.getelementbyId（...）评估为null？

在控制台中，我可以输入document.getElementById（'...'）并返回值。甚至.textContent并获取我想要的字符串。Chrome扩展 - Document.getelementbyId（...）评估为null？

一旦我将它放入我的扩展中并运行它，它将评估document.getElementById（'...'）为null。这是怎么回事？

manifest.json的：

{ 
    "name": "CSUF RMP", 
    "version": "0.1", 
    "manifest_version" : 2, 
    "description": "Displays professor ratings on icon click", 
    "background" : { 
    "scripts" : ["background.js"] 

    }, 
    "browser_action": { 
    "default_icon": "icon16.png" 
    }, 

    "content_scripts": [ 
     { 
      "matches": ["https://mycsuf.fullerton.edu/*"], 
      "js": ["script.js"] 

     } 
    ], 

    "permissions": ["<all_urls>", "*://*/*", "http://*/*", "https://*/*"] 
}

Background.js：

chrome.browserAction.onClicked.addListener(function(tab) { 
    chrome.tabs.executeScript(null, {file: "script.js"}); 
});

我的script.js简直是我贴在上面。该脚本应该有权访问网页的DOM（因此我需要一个内容脚本）并在点击图标（因此为background.js）上运行它。

我可以让页面运行并显示警报或者其他东西，但是该行并不评估页面的dom，只是null。

来源

2017-07-02 Kevin

'document.getElementById（'...'）' - 真的吗？我认为身份证不可能有'...'作为价值 –

我想我知道这里有什么问题，

您正在执行的script.js就像一个正常的脚本，和正常的脚本不能与页面的DOM互动，你可以只是想想而已从文件运行脚本 - 它没有这种内容脚本的权限。

你可以做的是打开一个新选项卡（带有内容脚本的url），然后传递给新标签上的内容脚本一条消息，告诉他在那里运行一个特定的功能。

您可以测试它，而无需使用消息通过类似内容脚本的onload设置的东西发送：onload=alert(document.getElementById('...'));，比打开从后台页面的新选项卡：chrome.tabs.create({"url":"https://mycsuf.fullerton.edu"});

告诉我是怎么一回事呢:)

编辑：忘记提及您需要清单文件中的“选项卡”权限才能打开新选项卡并测试该选项。

来源

2017-07-02 22:54:13 HUCK45

这是不是意味着一个新的全面选项卡？由于在background.js中的执行代码，我看到你在说什么，它不会作为内容脚本运行（因此不能访问DOM）。所以我需要让background.js在单击图标时发送消息（现在它执行脚本）。然后，msg被我的内容脚本，一些事件监听器的script.js拾取。然后它现在是一个“真正的”内容脚本。对？ – Kevin

准确。发送消息可能有点烦人，所以我想你可能更喜欢通过打开一个新选项卡并让内容脚本在其上运行来更快地检查它。 – HUCK45

你能解释一下新标签的含义吗？我理解它意味着像我的浏览器上打开的字面标签。 ---我的目标是在mycsuf.fullerton.edu * ....页面上，我可以点击扩展图标（可能会弹出），然后在该页面上我可以编辑DOM。我希望它被包含到1页。在我的手机上，或者我会编码这一切，但这意味着我可以使用发送消息（不执行），它应该作为一个内容脚本，并能够访问DOM，而不仅仅是一个background.js脚本（没有DOM访问）像这样？ – Kevin

Chrome扩展 - Document.getelementbyId（...）评估为null？

回答

相关问题