在Chrome扩展程序中访问DOM

时间:2018-06-05 16:17:30

标签: javascript google-chrome-extension

我使用示例here作为访问用户当前标签上的某些DOM元素的起点。在popup.html中,我有以下内容:

<script type="text/javascript" src="popup.js"></script>

popup.js的第一行是:

chrome.browserAction.onClicked.addListener(function(tab) {
  // No tabs or host permissions needed!
    console.log("test");
  console.log('Turning ' + tab.url + ' red!');
  chrome.tabs.executeScript({
    code: 'document.body.style.backgroundColor="red"'
  });
});

Manifest.json具有以下权限:

 {
"manifest_version": 2,
"name": "",
"version": "1.0",
"description": "",
"icons": { "16": "icon16.jpg",
    "48": "icon48.jpg",
   "128": "icon128.jpg" },
   "minimum_chrome_version": "46",
"browser_action": {
    "default_icon": "icon48.png",
    "default_popup": "popup.html"
},
"content_scripts": [
    {
        "matches": ["<all_urls>"],
        "js": ["jquery.min.js", "getDescription.js"],
        "run_at": "document_start"   
    }],
"options_page": "options.html",
"permissions": ["<all_urls>", "tabs","storage", "activeTab"]

}

控制台中没有任何内容出现,好像功能根本没有出现。

1 个答案:

答案 0 :(得分:1)

如果在点击浏览器操作图标时触发了here lineChart1Options: any = getChartOptionsObject();。如果浏览器操作有弹出窗口,则此事件将不会触发

如果您想要弹出窗口,然后在单击图标时执行脚本,请使用以下方法。

onClicked

在background.js中

{
  "name": "My Extension",
  "version": "0.1",
  "manifest_version" : 2,
  "description": "la lala laa",
  "background" : {
       "scripts" : ["background.js"]
  },
  "browser_action": {
      "default_icon": "icon48.png",
      "default_popup": "popup.html"
  },
  "permissions": ["activeTab"]
}

如果你的popup.html中有以下内容,它应该可以正常工作

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

在你的popup.js

<script src="popup.js"></script>