前端js怎么通过class来改变元素样式

Question

前端js怎么通过class来改变元素样式在循环里 前端js怎么通过class来改变元素样式在循环里

Answer 1

让阿豪来帮你解答，本回答参考chatgpt3.5编写提供，如果还有疑问可以评论或留言

可以使用querySelectorAll和forEach方法来实现在循环里通过class来改变元素样式。 示例代码如下： HTML：

<ul>
   <li class="item">item1</li>
   <li class="item">item2</li>
   <li class="item">item3</li>
</ul>

JavaScript：

const items = document.querySelectorAll('.item');
items.forEach(item => {
   item.classList.add('active');
});

上面这段代码会给所有class为item的li元素加上active这个class，从而改变它们的样式。 其中，querySelectorAll方法返回一个NodeList对象，它包含了所有指定的元素，可以通过forEach方法遍历每个元素并进行操作。 注：如果需要移除原有的class，可以使用classList.remove方法，例如：

items.forEach(item => {
   item.classList.remove('active');
});