Как удалить все экземпляры класса в javascript/jquery?

У меня есть класс, называемый .m-active, который используется несколько раз в моем HTML.

В основном я хочу удалить все экземпляры этого класса, когда пользователь нажимает на изображение (у которого нет класса m-active) и добавляет к этому образству класс m-active.

Например, в строке Backgrid у вас может быть обработчик кликов следующим образом:

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

Но вы также хотите удалить этот класс из любых строк, к которым он был добавлен ранее, так что только одна строка за раз имеет класс .m-active

Кто-нибудь знает, как это можно сделать в javascript/jquery?

Ответы

Ответ 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

Ответ 2

все ответы указывают на удаление класса из элемента DOM. Но если вы попросите удалить сам элемент, вы можете использовать .remove() метод jquery

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

JQuery Удалить документы

Ответ 3

Jquery -:

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

Javascript -: Не устанавливайте имя класса, когда вы хотите удалить класс в javascript.

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

или

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

Ответ 4

В частности, обращение к блоку кода добавлено для повышения качества вопроса и заимствования из jsalonen:

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