jQuery - удаляет все классы с похожими именами

Question

Есть ли лучший способ сделать это?

$('element').removeClass('class-1').removeClass('class-2').removeClass('class-3').removeClass('class-5') ...
to .removeClass('class-105')
:)

Я хочу удалить все классы (n) классов.

Answer 1

Вот небольшой плагин jQuery, который я использую для этой цели:

(function($) {
    $.fn.removeClassWild = function(mask) {
        return this.removeClass(function(index, cls) {
            var re = mask.replace(/\*/g, '\\S+');
            return (cls.match(new RegExp('\\b' + re + '', 'g')) || []).join(' ');
        });
    };
})(jQuery);

Вы используете это так:

$(...).removeClassWild('class-*');

Answer 2

Получить классы элемента, обработать его как строку и вернуть обратно:

$('element').attr(
  'className',
  $('element').attr('className').replace(/\bclass-\d+\b/g, '')
);

Редактировать:

Метод attr с тех пор изменился и недольше читает свойства, поэтому вы должны использовать имя атрибута class вместо имени свойства className:

$('element').attr(
  'class',
  $('element').attr('class').replace(/\bclass-\d+\b/g, '')
);

Answer 3

Делать это лучше с помощью селектора CSS, [type*=value]

$(function() {
    var i = 0;
    while( ++i <= 105) {
        $('b').addClass('class-'+ i);
    }
  var clas = '';
  var arey =[]
    $('input[type=button]').click(function() {  
        clas = $('b').attr('class');
        arey = clas.match(/class-\d{1,3}/g);
        $.each(arey, function(i, e) {
            $('b').removeClass(e);      
        });
    });
}); 

Редактировать :

Демо: http://jsbin.com/opebu4/2

Answer 4

... или вы можете использовать селектор запуска с , если вы знаете возможные имена классов, которые вы хотите удалить.Неприятная часть задачи - огромное количество классов, которые нужно искать ...

$(document).ready(function () {
     var classesOfInterest = '';
     for(var i = 1; i<=105; i++)
        classesOfInterest += ' ' + 'class-' + i;
     alert(classesOfInterest);
     $("[class^='class-']").removeClass(classesOfInterest);
  });