Question

我想在页面谷歌日历中插入一个按钮，但它不起作用..

的manifest.json

    {  
  "name": " Demo ",
  "description": " demo ",
  "version": "1.0",
  "background": {
    "scripts": ["background.js"]
  },
  "content_scripts": [{"matches": ["https://www.google.com/calendar/*"],
                      "js": ["demo.js"]}
                      ],
  "permissions": [
    "tabs", "http://*/*", "https://*/*",
    "activeTab"
  ],
  "browser_action": {
    "default_icon": "icon.png"
  },
  "icons" : {

    "128" : "icon.png"
  },

  "manifest_version": 2
}

和content_scripts（demo.js）：

document.addEventListener('DOMContentLoaded', function () {
                      var buttonOnSite = document.getElementById(":10.calendar-row"),
                      parent = buttonOnSite.parentElement,
                      next = buttonOnSite.nextSibling,
                      button = document.createElement("button"),
                      text = document.createTextNode("test");
                      button.appendChild(text);
                      if (next) parent.insertBefore(button, next);
                      else parent.appendChild(button);
});

然后我打开谷歌日历...我找不到我的按钮.. :10.calendar-row是页面日历元素的ID ...

如何在页面谷歌日历中插入按钮，谢谢！

我有第二个问题，我无法调试，调试按钮是灰色的....为什么？

Answer 1

您是否确保google日历的网址正确且与manifest.json中的模式相符？（不像https://calendar.google.com/calendar？）

您可以打开Chrome开发工具，在“来源”标签下，确保您可以找到自己的内容脚本。您可以在内容脚本上设置断点，以查看它是否实际运行。

Screenshot: Chrome Dev Tools > Sources > Content Scripts

Chrome扩展程序如何在页面谷歌日历中插入按钮

1 个答案: