Question

尝试将类添加到具有特定数据属性的元素。

元素是：<a data-type="foo">Linkypoo</a>

我试图像这样瞄准：

document.querySelectorAll('[data-type="foo"]').classList.add('Booya');

但我收到了错误：

未捕获的TypeError：无法读取属性＆＃39;添加＆＃39;未定义的

有人能指出我正确的方向吗？不知道怎么用vanilla js做这个。

谢谢：）

Answer 1

querySelectorAll返回一个Element-Collection，以访问第一个使用querySelectorAll(...)[0]

的元素

如果您想将它应用于所有元素，您可以循环浏览它们，如下例所示：

var elements = document.querySelectorAll('[data-type="foo"]')

for (var i = 0; i < elements.length; ++i) {
  elements[i].classList.add('Booya');
}

.Booya {
  color: red;
}

<a data-type="foo">Linkypoo 1</a>
<a data-type="foo">Linkypoo 2</a>
<a data-type="foo">Linkypoo 3</a>
<a data-type="foo">Linkypoo 4</a>

Vanilla JavaScript - 使用特定数据attr向元素添加类的语法

1 个答案: