Question

我使用以下功能将我的“时钟网站”更改为更轻的主题。

var light = function() {
    document.getElementsByClassName('themechange').style.color = "black"
    document.getElementsByTagName('body').style.backgroundColor = "white";
};

当我尝试运行该函数时，我在标题中收到错误。如果您需要更多代码，请检查元素here

Answer 1

Document.getElementsByClassName()和Document.getElementsByTagName()都返回NodeLists个对象。

您无法直接将设置应用于NodeList，您必须对其进行迭代并将设置应用于每个Node。

但是，您可以使用Document.body直接引用body元素。

Document.getElementsByClassName()为not supported in Internet Explorer 8，但Document.querySelectorAll()为supported。

/*    Select all elements with the class `themechange`
 *    Iterate with a for loop
 *    Set each element's background color to `black`
 *    Set the body's background color to `white`
 */
var light = function() {
    var themeChanges = document.querySelectorAll('.themechange'), themeChange, i;
    for(i = 0; (themeChange = themeChanges[i]); i++) {
        themeChange.style.color = "black"
    }
    document.body.style.backgroundColor = "white";
};

Answer 2

getElementsByClassName函数返回NodeList，而不是元素。您需要使用循环来更改列表中所有元素的样式属性，而不是尝试访问NodeList的不存在的样式属性。

Answer 3

只需在i == Object.length停留返回的对象，然后访问索引为i的每个元素。

document.getElementsByClassName('themechange')[0].style.color = "black"
document.getElementsByTagName('body')[0].style.backgroundColor = "white";

“无法设置未定义的颜色”是什么意思？

3 个答案: