如何删除以…开头的类？

HTML

JS

 $("div[class^='ativo']").on("click", function(){ $(this).removeClass("^='ativo'"); // How to achieve it? }); 

我能做什么而不是.removeClass("^='ativo'"); ？

的jsfiddle

Answer 1

.removeClass()接受一个删除类的函数，并接受索引和旧的CSS值：

一个函数，返回一个或多个要删除的空格分隔的类名。 接收集合中元素的索引位置和旧类值作为参数。

您可以删除以必需名称开头的类名，并使用以下内容保留现有名称：

 $("div[class*='ativo']").removeClass (function (index, css) { return (css.match (/(^|\s)ativo\S+/g) || []).join(' '); }); 

工作演示

Answer 2

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

您可以使用此纯Javascript解决方案。

Answer 3

我上面的解决方案有问题，它有时只从className中删除匹配的前缀而不是整个类。 所以我把它改成了这个

 function removeClassByPrefix(el, prefix) { var regx = new RegExp('\\b' + prefix + '.*?\\b', 'g'); [...el.classList].map(className => { regx.test(className) && item.classList.remove(className); }); } 

Answer 4

没有jQuery，你可以使用classList和startsWith ：

 var el = document.querySelector('div[class^="ativo"]'); el.classList.forEach(className => { if (className.startsWith('ativo')) { el.classList.remove(className); } });