代码之家 › 专栏 › 技术社区 › Sartorialist

在Chrome扩展中访问DOM

google-chrome-extension javascript

Sartorialist · 技术社区 · 8 年前

我在用这个例子 here 作为访问用户当前选项卡上某些DOM元素的起点。在弹出窗口中。html,我有以下内容:

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

以及弹出窗口的第一行。他们是:

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"'
  });
});

显示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 回复 | 直到 8 年前

prime 8 年前

正如上面提到的 here onClicked 单击浏览器操作图标时激发。这件事 不会开火 如果浏览器操作有弹出窗口。

如果你想弹出窗口,然后在点击图标时执行脚本,请使用下面的方法。

{
  "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"]
}

背景里面。js

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

或者,如果弹出窗口中有以下内容,它应该可以正常工作。html

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

在弹出窗口中。js

window.onload = function() { 
    console.log("do whatever you want here !!!") 
}

推荐文章

rozsazoltan · 直接从URL创建Manifest v3 URL重定向

1 年前

Skyyade · 如何在Chrome扩展程序中导入html2canvas

1 年前

Kwang Sing · 在chrome扩展中为请求添加前缀的正确设置是什么?

1 年前

DamilolaOwonibi · 我的background.js无法识别正在打开的选项卡

2 年前

ThePenguin · Chrome重复控制台条目

2 年前

SwiftyQA · 在随机持续时间内点击Chrome扩展的按钮

2 年前

J.C · 你是如何使用Chrome扩展程序在一个月内更改网站的CSS的?

2 年前

Teepeemm · Chrome扩展程序如何触发Angular文件上传

2 年前

OrionGL · 本应自动更新的范围输入在手动设置后停止更新

2 年前

Grasper · replaceAll函数禁用某些站点元素

2 年前