Chrome扩展：内容脚本没有找到DOM元素

我正在写一个Chrome扩展，并具有以下代码Chrome扩展：内容脚本没有找到DOM元素

popup.html：

<script type='text/javascript' src='content.js'></script>

content.js：

var container = document.getElementById('viewer') 
container.style['white-space'] = 'nowrap' 

var node_list = document.getElementsByClassName('page') 
Array.prototype.forEach.call(node_list, function(page) { 
    page.style['display'] = 'inline-block' 
})

manifest.json：

{ 
    "name": "horizontal_pdf", 
    "version": "0.0.1", 
    "manifest_version": 2, 
    "browser_action": { 
     "default_title": "My Title", 
     "default_popup": "popup.html", 
     "default_icon": { 
      "16": "icons/16x16.jpg", 
      "32": "icons/32x32.jpg" 
     } 
    } 
}

但是当我点击该图标，并期待在控制台上，我看到错误消息：

Uncaught TypeError: Cannot read property 'style' of null

在content.js的2线。所以，它无法找到ID为viewer的div。但是当我看着这个网页的时候，它就在那里。我究竟做错了什么？

PS：我没有在清单中指定内容脚本，因为我不希望它自动触发，但只有当用户单击图标时才会触发。

来源

2014-08-27 tldr

脚本可能在DOM的那部分准备好之前运行？ – 2014-08-27 16:02:34

你的清单看起来像什么？ – 2014-08-27 16:05:24

用清单 – tldr 2014-08-27 16:45:17

根据Google的文档，您可以使用程序注入。

在后台脚本，你可以添加：

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

或者，也许你弹出脚本，您可以拨打：

chrome.tabs.executeScript(null, {file: "content.js"});

（你需要添加activeTab许可，任何方式）

https://developer.chrome.com/extensions/content_scripts#pi

来源

2014-08-27 17:15:07

-1

如果你想在popup.h中得到DOM tml/js你必须为内容脚本添加content.js，然后向popup.js发送消息，或者你可以调用来自popup.js的content.js来获取信息...后台脚本不能访问dom .. 。这是我所做的...

来源

2014-12-03 22:42:12 user4322168

Chrome扩展：内容脚本没有找到DOM元素

回答

相关问题