如何在 javascript/jquery 中删除所有类的实例？

Question

我有一个被称为.m-active的类，在我的HTML中多次使用。

基本上，我想要做的是，当用户单击一个没有m-active类的图像时，删除所有该类的实例，并将m-active类添加到该图像。

例如，在Backgrid行中，您可能会有以下点击处理程序：

"click": function () {
    this.$el.addClass('m-active');
}

但您还希望从以前添加了该类的任何行中删除它，以便一次只有一行具有 .m-active 类。

有人知道如何在javascript / jquery中实现吗？

- jdc987

---

是的，我尝试过removeClass，但它不能做我想要的事情。 - jdc987

可能是重复问题：从所有元素（而不是单个定义的元素）中删除 .removeClass。原问题链接：https://dev59.com/l1nUa4cB1Zd3GeqPeM8M。 - Mottie

第二部分将是 $(this).addClass('m-active');。 - f p

Answer 1

使用jQuery：

$('.m-active').removeClass('m-active');

说明：

• 调用 $('.m-active') 选择文档中所有包含类 m-active 的元素
• 无论您在此选择器后链接什么，都会应用于所有已选元素
• 将调用与 removeClass('m-active') 链接，从所有已选元素中删除类 m-active

关于此特定方法的文档，请参见：http://api.jquery.com/removeClass/

使用 jQuery 理解整个选择器工作原理起初有一定难度，但一旦掌握，您会以非常不同的方式看待所有内容。我鼓励您查看一些优秀的 jQuery 教程。我个人推荐查看 Codeacademy 的 jQuery 学习路径：http://www.codecademy.com/tracks/jquery

- jsalonen

---

这会删除我整个HTML文件中所有实例的m-active吗？ - jdc987

实际上是的。请看我添加的解释！ - jsalonen

太好了，这正是我在搜索时找不到的。感谢您的解释（我对jquery/javascript/编程都很新，这对我很有帮助）！ - jdc987

Answer 2

所有答案都指向从DOM元素中删除类。但是，如果您要删除元素本身，则可以使用.remove() jquery方法。

$('.m-active').remove();

JQuery删除文档

- Alireza

Answer 3

使用纯JavaScript（不使用jQuery）：

for (elem of document.getElementsByClassName("m-active")) {
    elem.classList.remove("m-active");
}

- AldaronLau

---

这里有一个错误。elem需要用let、var或const声明。还是+1，因为这个答案有帮助。 - Louise Eggleton

Answer 4

具体来说，针对添加的代码块以加强问题质量，并借鉴jsalonen的建议：

"click": function () {
    $('.m-active').removeClass('m-active');
    this.$el.addClass('m-active');
}

- Dexygen

Answer 5

Jquery-:

$("class").removeClass("your class");

javascript-：在 JavaScript 中要删除 class 时，将类名设置为空即可！！！

document.getElementById("your id").className = "";

或者

element.classList.remove("class name");

- HIRA THAKUR