删除以特定string开头的所有类

我有一个id="a"的div，可能有几个类别附加的类别。 每个组都有一个特定的前缀。 在JavaScript中，我不知道该组中的哪一个类是在div上。 我希望能够清除给定前缀的所有类，然后添加一个新的。 如果我想删除所有以“bg”开头的类，我该怎么做？ 像这样的东西，但实际上工作：

 $("#a").removeClass("bg*"); 

Answer 1

使用jQuery，实际的DOM元素是在索引零，这应该工作

 $('#a')[0].className = $('#a')[0].className.replace(/\bbg.*?\b/g, ''); 

Answer 2

正则expression式在字边界\b分裂并不是最好的解决scheme：

 var prefix = "prefix"; var classes = el.className.split(" ").filter(function(c) { return c.lastIndexOf(prefix, 0) !== 0; }); el.className = classes.join(" ").trim(); 

或者作为一个jQuery混搭：

 $.fn.removeClassPrefix = function(prefix) { this.each(function(i, el) { var classes = el.className.split(" ").filter(function(c) { return c.lastIndexOf(prefix, 0) !== 0; }); el.className = $.trim(classes.join(" ")); }); return this; }; 

Answer 3

我写了一个简单的jQuery插件，alterClass，去除了通配符类。 还可以select添加类： https ： //gist.github.com/1517285

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

Answer 4

你不需要任何jQuery特定的代码来处理这个。 只需使用RegExp即可replace它们：

 $("#a").className = $("#a").className.replace(/\bbg.*?\b/g, ''); 

你可以修改这个以支持任何前缀，但是更快的方法在上面，因为RegExp只被编译一次：

 function removeClassByPrefix(el, prefix) { var regx = new RegExp('\\b' + prefix + '.*?\\b', 'g'); el.className = el.className.replace(regx, ''); return el; } 

Answer 5

使用$.fn.removeClass 第二个签名 ：

 // Considering: var $el = $('<div class=" foo-1 ab foo-2 c foo"/>'); function makeRemoveClassHandler(regex) { return function (index, classes) { return classes.split(/\s+/).filter(function (el) {return regex.test(el);}).join(' '); } } $el.removeClass(makeRemoveClassHandler(/^foo-/)); //> [<div class=​"abc foo">​</div>​] 

Answer 6

http://www.mail-archive.com/[e-mail]/msg03998.html说：;

…和.removeClass（）将删除所有类…

这个对我有用 ;）

干杯

Answer 7

我正在寻找解决scheme完全相同的问题。 删除所有以“fontid_”开头的类在阅读本文之后，我写了一个我现在使用的小插件。

 (function ($) { $.fn.removePrefixedClasses = function (prefix) { var classNames = $(this).attr('class').split(' '), className, newClassNames = [], i; //loop class names for(i = 0; i < classNames.length; i++) { className = classNames[i]; // if prefix not found at the beggining of class name if(className.indexOf(prefix) !== 0) { newClassNames.push(className); continue; } } // write new list excluding filtered classNames $(this).attr('class', newClassNames.join(' ')); }; }(fQuery)); 

用法：

 $('#elementId').removePrefixedClasses('prefix-of-classes_'); 

Answer 8

我将使用简单的jQuery构造函数和数组处理函数的一种方法是声明一个函数，该函数采用类的控件和前缀的id，并删除所有分类。 代码如下：

 function removeclasses(controlIndex,classPrefix){ var classes = $("#"+controlIndex).attr("class").split(" "); $.each(classes,function(index) { if(classes[index].indexOf(classPrefix)==0) { $("#"+controlIndex).removeClass(classes[index]); } }); } 

现在，这个function可以从任何地方调用，button或从代码：

 removeclasses("a","bg"); 

Answer 9

我知道这是一个古老的问题，但我find了新的解决scheme，并想知道它是否有缺点？

 $('#a')[0].className = $('#a')[0].className .replace(/(^|\s)bg.*?(\s|$)/g, ' ') .replace(/\s\s+/g, ' ') .replace(/(^\s|\s$)/g, ''); 

Answer 10

Prestaul的回答很有帮助，但对我来说并不合适。 jQuery按idselect对象的方式不起作用。 我不得不使用

 document.getElementById("a").className 

代替

 $("#a").className 

Answer 11

我也使用连字符'和数字作为类名。 所以我的版本包括'\ d-'

 $('#a')[0].className = $('#a')[0].className.replace(/\bbg.\d-*?\b/g, ''); 

Answer 12

 (function($) { return this.each(function() { var classes = $(this).attr('class'); if(!classes || !regex) return false; var classArray = []; classes = classes.split(' '); for(var i=0, len=classes.length; i<len; i++) if(!classes[i].match(regex)) classArray.push(classes[i]); $(this).attr('class', classArray.join(' ')); }); })(jQuery); 

Answer 13

在一行中删除所有匹配正则expression式someRegExp的类

 $('#my_element_id').removeClass( function() { return (this.className.match(/someRegExp/g) || []).join(' ').replace(prog.status.toLowerCase(),'');}); 

Answer 14

 $("#element").removeAttr("class").addClass("yourClass");