Chrome 扩展类型错误答案

【问题标题】：Chrome Extension TypeErrorChrome 扩展类型错误
【发布时间】：2021-11-06 16:44:25
【问题描述】：

我想在 YouTube 上添加一个红色突出显示的按钮。但它不起作用。

manifest.json

{
  "name": "Example",
  "version": "0.0",
  "manifest_version": 2,
  "content_scripts": [
    {
      "js": ["content.js"],
      "matches": ["<all_urls>"],
      "css": ["style.css"]
    }],
  "browser_action": {
    "default_popup": "addon_menu.html",
    "default_title": "Example"
  }
}

content.js

console.log("Example is on!");


var  sttndiv = document.createElement("div");
var sttnbtn = document.createElement("button");
sttndiv.appendChild(sttnbtn);
document.getElementById("buttons").getElementsByClassName("yt-live-chat-message-input-renderer")[0].appendChild(sttndiv)[0];

Uncaught TypeError: Cannot read properties of undefined (reading 'appendChild')

【问题讨论】：

如果您只想定位 YT，请不要定位 <all_urls>。
@Andy 目前没有必要。我稍后再做，谢谢。
错误很明显。您尝试将子元素附加到的元素不存在。你做过一些简单的调试吗？

标签： javascript google-chrome google-chrome-extension manifest.json

【解决方案1】：

通过错误和常识，你可以看到sttndiv是未定义的，这可能是因为它前面有一个双空格。

【讨论】：