转Googlechrome分机"off"和"on"？

Question

我是第一次开发 Chrome 扩展程序，我有一个内容脚本，我想在每次单击扩展程序图标时触发它，然后在图标打开时 "off"再次点击，依此类推。我想知道是否有人可以帮我解决这个问题？下面是我到目前为止的代码。

manifest.json

  {
 "manifest_version": 2,

 "name": "ROTATE",
 "description": "This extension will do unspeakable deeds of great importance.",
 "version": "1.0",
 "browser_action": { },

 "icons": { "16": "icon16.png",
            "48": "icon48.png",
           "128": "icon128.png" 
 },

 "background": {
   "scripts": ["background.js"]
 },

  "content_scripts": [
    {
    "matches": ["<all_urls>"],
    "js": ["content.js"]
    }
  ],

 "permissions": 
     ["activeTab"]
  }

content.js

['', '-ms-', '-webkit-', '-o-', '-moz-'].map(function(prefix){
Array.prototype.slice.call(document.querySelectorAll('div,p,span,img,a,body')).map(function(el){
    el.style[prefix + 'transform'] = 'rotate(' + (Math.floor(Math.random() * 10) - 1) + 'deg)';
    });
});

background.js

（我知道有一个更好的方法，使用消息传递，但我想不通。另外，这实际上并不能使页面恢复正常。）

 r toggle = false;
  chrome.browserAction.onClicked.addListener(function(tab) {
    toggle = !toggle;

 if(toggle){
   chrome.tabs.executeScript(tab.id, {file:"content.js"});
 }
 else{
   chrome.tabs.return;
 }
 });

如有任何帮助，我将不胜感激。谢谢！

编辑：仍然欢迎任何反馈！谢谢！

Answer 1

最少的更改是使用第二个内容脚本来撤消第一个内容脚本所做的一切：

el.style[prefix+'transform'] = 'rotate(0deg)';

但是如果你多次点击按钮，你就会多次注入相同的代码，我的大脑就会对所有事情的优先级感到困惑。

消息传递方法可能会更好。我要做的主要更改是将 toggle 移动到内容脚本中，这样您就可以在两个单独的选项卡中使用此运行（这也会将状态从后台页面中取出，因此您可以把它变成一个活动页面）。您的内容脚本最终将是：

var toggle = false;
chrome.runtime.onMessage.addListener(function() {
  toggle = ! toggle;
  Array.prototype.forEach.call(document.querySelectorAll('div,p,span,img,a,body'),function(el) {
    el.style.transform = 'rotate(' + (toggle?(Math.floor(Math.random() * 10) - 1):0) + 'deg)';
  });
});

你的后台脚本就是：

chrome.browserAction.onClicked.addListener(function(tab) {
  chrome.tabs.sendMessage(tab.id,{});
});

最后说明：你知道它是 Chrome，所以你只需要一个转换前缀（我认为是空白的）。 Array.prototype.map 的函数参数应该 return 一些东西；因为你没有 returning 任何东西，所以我使用了 Array.prototype.forEach。事实证明，如果您调用 map 或 forEach，则不需要 slice。

最终结果：

转Googlechrome分机"off"和"on"？

Turn Google chrome extension "off" and "on"?

javascript

google-chrome

message-passing

google-chrome-extension

content-script