JQuery removeClass générique

Question

Existe-t-il un moyen facile de supprimer toutes les classes correspondant, par exemple,

 color-*
 

donc si j'ai un élément:

 <div id="hello" class="color-red color-brown foo bar"></div>
 

après l'avoir enlevé, ce serait

 <div id="hello" class="foo bar"></div>
 

Merci!

Answer 1

La fonction removeClass prend un argument de fonction depuis jQuery 1.4 .

 $("#hello").removeClass (function (index, css) {
    return (css.match (/(^|\s)color-\S+/g) || []).join(' ');
});
 

Exemple en direct: http://jsfiddle.net/jimmysv/xa9xS/

Answer 2

$('div').attr('class',
           function(i, c){
              return c.replace(/(^|\s)color-\S+/g, '');
           });

Answer 3

J'ai écrit un plugin qui s'appelle alterClass - Supprime les classes d'éléments avec des caractères génériques. Ajoutez éventuellement des cours: https://gist.github.com/1517285

 $( '#foo' ).alterClass( 'foo-* bar-*', 'foobar' )
 

Answer 4

J'ai généralisé cette dans un plugin Jquery qui prend une regex comme un argument.

Café:

$.fn.removeClassRegex = (regex) ->
  $(@).removeClass (index, classes) ->
    classes.split(/\s+/).filter (c) ->
      regex.test c
    .join ' '

Javascript:

$.fn.removeClassRegex = function(regex) {
  return $(this).removeClass(function(index, classes) {
    return classes.split(/\s+/).filter(function(c) {
      return regex.test(c);
    }).join(' ');
  });
};

Donc, pour ce cas, l'utilisation serait (à la fois Café et Javascript):

$('#hello').removeClassRegex(/^color-/)

Note que je suis en utilisant l' Array.filter fonction qui n'existe pas dans IE<9. Vous pouvez utiliser le trait de Soulignement de la fonction de filtre au lieu de Google pour un polyfill comme ce WTFPL un.

Answer 5

Plus simple que @tremby la réponse, ici, c'est @Kobi la réponse comme un plugin qui va correspondre à des préfixes ou des suffixes.

• ex) bandes btn-mini et btn-danger mais pas btn lorsque stripClass("btn-").
• ex) bandes horsebtn et cowbtn mais pas btn-mini ou btn lorsque stripClass('btn', 1)

Code:

$.fn.stripClass = function (partialMatch, endOrBegin) {
    /// <summary>
    /// The way removeClass should have been implemented -- accepts a partialMatch (like "btn-") to search on and remove
    /// </summary>
    /// <param name="partialMatch">the class partial to match against, like "btn-" to match "btn-danger btn-active" but not "btn"</param>
    /// <param name="endOrBegin">omit for beginning match; provide a 'truthy' value to only find classes ending with match</param>
    /// <returns type=""></returns>
    var x = new RegExp((!endOrBegin ? "\\b" : "\\S+") + partialMatch + "\\S*", 'g');

    // http://stackoverflow.com/a/2644364/1037948
    this.attr('class', function (i, c) {
        if (!c) return; // protect against no class
        return c.replace(x, '');
    });
    return this;
};

https://gist.github.com/zaus/6734731