Как удалить все CSS-классы, используя jQuery / JavaScript?

Question

Вместо того, чтобы индивидуально вызывать $("#item").removeClass() для каждого отдельного класса, который может иметь элемент, существует ли одна вызываемая функция, которая удаляет все классы CSS из данного элемента?

Будет работать как jQuery, так и сырой JavaScript.

Answer 1

Поскольку не все версии jQuery созданы равными, вы можете столкнуться с той же проблемой, что и я, что означает вызов $ ("# item"). RemoveClass (); на самом деле не удаляет класс. (Возможно ошибка)

Более надежный метод - просто использовать сырой JavaScript и полностью удалить атрибут class.

document.getElementById("item").removeAttribute("class");

Answer 2

Давайте использовать этот пример. Возможно, вы хотите, чтобы пользователь вашего веб-сайта знал, что поле является действительным, или ему нужно уделить внимание, изменив цвет фона поля. Если пользователь нажимает кнопку сброса, ваш код должен сбрасывать только те поля, в которых есть данные, и не пытаться перебирать все остальные поля на вашей странице.

Этот фильтр jQuery удалит класс "highlightCriteria" только для поля ввода или выбора, которые имеют этот класс.

$form.find('input,select').filter(function () {
    if((!!this.value) && (!!this.name)) {
        $("#"+this.id).removeClass("highlightCriteria");
    }
});

Answer 3

У меня была похожая проблема. В моем случае к отключенным элементам применялся тот класс aspNetDisabled и все отключенные элементы управления, которые имели неправильные цвета. Поэтому я использовал jquery для удаления этого класса на каждом элементе / элементе управления, который у меня есть, и теперь все работает и выглядит отлично.

Это мой код для удаления класса aspNetDisabled:

$(document).ready(function () {

    $("span").removeClass("aspNetDisabled");
    $("select").removeClass("aspNetDisabled");
    $("input").removeClass("aspNetDisabled");

});