Question

这是我的javascript代码：

document.getElementsByClassName('loader').style.opacity = "0";

此代码将在我的控制台中显示以下错误：

TypeError: 'undefined' is not an object (evaluating 'document.getElementsByClassName('loader').style.opacity = "0"')

我已经尝试过这些，但这些也不起作用：

document.document.querySelectorAll('.loader').style.opacity = '0';
document.document.querySelector('.loader').style.opacity = '0';

我的HTML代码：

<div class="loader">Some Text</div>

Answer 1

.getElementsByClassName()函数返回元素的列表。您必须使用自己的代码迭代该列表。

var loaders = document.getElementsByClassName('loader');
for (var i = 0; i < loaders.length; ++i)
  loaders[i].style.opacity = '0';

如果您只想对列表中的特定成员进行操作，您可以（如果您要小心）将其视为数组。我提到要小心，因为.getElementsByClassName()会返回＆＃34; live＆＃34;节点列表。如果删除类＆＃34; loader＆＃34;从一个或多个元素中，列表将发生变化。（对于从.querySelectorAll()返回的列表，情况并非如此。）

Answer 2

如果按类选择元素，则最有可能最终得到一个元素数组。您需要为每个参数设置参数。纯JS在这方面并不像jQuery那样。

首先通过

进行选择

var elements = document.getElementsByClassName('loader');

然后循环通过它们

for(var i=0; i<elements.length; i++){
    elements[i].style.opacity = "0";
}

看看这是否有帮助..

无法将样式设置为具有指定类javascript的元素

2 个答案: