此 chrome 扩展代码不起作用，我不知道

Question

我正在为 Roblox 网页开发这个小的 chrome 扩展，但出于某种原因，它根本不想正常工作。

错误是

Uncaught TypeError: Cannot set property 'background' of undefined
at extension_update (themeManager.js:7)
at themeManager.js:14

这是代码：

var colorOnePath = document.getElementsByClassName("navbar-fixed-top rbx-header");
var colorTwoPath = [document.getElementsByTagName("body"), document.getElementsByClassName("content")];    

var color = ["#008919", "#000000"];

function extension_update() {
    colorOnePath.style.background = color[0];
    colorTwoPath[0].style.background = color[1];
    colorTwoPath[1].style.background = color[1];

    setTimeout(1000, extension_update)
};

extension_update()

我不知道为什么代码是这样设置的，但无论如何，有什么地方有问题吗？ 我找不到修复的地方。 谢谢！

Answer 1

getElementsByClassName将始终返回一个类似数组的元素集合——即使只有一个。 因此，在您的代码中，您不是在集合中的第一个元素上设置style.background属性，而是尝试在集合本身上设置它——因为该集合没有style属性，您会看到您看到的错误。 尝试将您的代码更改为：

var colorOnePath = document.getElementsByClassName("navbar-fixed-top rbx-header")[0];
var colorTwoPath = [document.getElementsByTagName("body")[0], document.getElementsByClassName("content")[0]];    

var color = ["#008919", "#000000"];

function extension_update() {
    colorOnePath.style.background = color[0];
    colorTwoPath[0].style.background = color[1];
    colorTwoPath[1].style.background = color[1];

    setTimeout(1000, extension_update);
}

extension_update();

（我还冒昧地在缺少分号的地方添加了分号，并在不必要的地方删除了分号）。