Javascript 为什么document.getElementsByClassName不断返回未定义的数组?

Javascript 为什么document.getElementsByClassName不断返回未定义的数组?,javascript,jquery,google-chrome,google-chrome-extension,Javascript,Jquery,Google Chrome,Google Chrome Extension,我正在尝试制作一个简单的Chrome扩展,通过点击几个按钮激活YouTube黑暗模式 alert("Clicker"); //document.getElementsByClassName("button.style-scope.ytd-topbar-menu-button-renderer")[0].click(); var buttons = Array.from(document.getElementsByClassName("button.style-scope.ytd-topbar-

我正在尝试制作一个简单的Chrome扩展,通过点击几个按钮激活YouTube黑暗模式

alert("Clicker");

//document.getElementsByClassName("button.style-scope.ytd-topbar-menu-button-renderer")[0].click();
var buttons = Array.from(document.getElementsByClassName("button.style-scope.ytd-topbar-menu-button-renderer").innerHTML);

console.log(buttons[0]);
buttons[0].click();
我正在测试这个。我有一个manifest.json:

{
    "manifest_version": 2,

    "name": "Youtube Dark Mode",
    "version": "1.0.0",

    "permissions": [
        "https://www.youtube.com/*",
        "tabs",
        "activeTab"
    ],

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

    "browser_action": {
        "default_title": "Engage Youtube Dark Mode."
    },

    "content_scripts": [
    {
      "matches": ["https://www.youtube.com/*"],
      "js": ["content.js"]
    }]
}
和一个background.js:

chrome.browserAction.onClicked.addListener(function(tab) {
    //alert("Boat");

    chrome.tabs.executeScript(null, {file: "clicker.js"});
});
我在这里读过很多类似的帖子,但他们的建议对我都不起作用(可能是因为我不太懂Javascript)。问题在于,
.click
不是
按钮[0]
的属性,或者
按钮
数组未定义

这段代码实际上是在尝试放置
$(“button.ytd topbar菜单按钮渲染器”)。单击()转换为扩展形式,因为我知道jQuery在开发人员控制台中工作


任何帮助都将不胜感激。谢谢

不要在
文档的类名称中使用
。getElementsByClassName


如果要使用选择器
“按钮.style scope.ytd topbar菜单按钮渲染器”
进行选择,请改用
document.querySelectorAll

不要在
文档的类名中使用
。getElementsByClassName


如果要使用选择器
“button.style scope.ytd topbar菜单按钮渲染器”
进行选择,请改用
document.querySelectorAll

因为元素集合上的
.innerHTML
返回未定义?放弃那个财产访问权!这看起来不像类名:
“button.style scope.ytd topbar菜单按钮渲染器”
。更改为:
'style-scope ytd topbar菜单按钮渲染器'
,或改用
查询选择全部
!事实证明,这两个注释一起起作用(参见公认的答案)。谢谢@bergi和ibrahim mahrir!因为元素集合上的
.innerHTML
返回未定义的?放弃那个财产访问权!这看起来不像类名:
“button.style scope.ytd topbar菜单按钮渲染器”
。更改为:
'style-scope ytd topbar菜单按钮渲染器'
,或改用
查询选择全部
!事实证明,这两个注释一起起作用(参见公认的答案)。谢谢@bergi和ibrahim mahrir!哦,那完全奏效了。我还必须删除.innerHTML:
var buttons=document.querySelectorAll(“button.ytd topbar菜单按钮渲染器”)[0];控制台日志(按钮);按钮。单击()谢谢你的帮助!哦,那完全奏效了。我还必须删除.innerHTML:
var buttons=document.querySelectorAll(“button.ytd topbar菜单按钮渲染器”)[0];控制台日志(按钮);按钮。单击()谢谢你的帮助!