9

我收到了几个自动生成的 HTML 文档,这些文档长达数千行,我需要清理源代码。主要需要删除“table-col-##”之类的类名。这是一个两步问题:

  1. 选择具有 table-col-## 的所有类,其中 ## 是 0-999 之间的整数
  2. 从元素中移除匹配的类,而不移除任何其他类

所以它归结为:如果可能的话,我需要一种方法在 $() 选择器中使用正则表达式,然后在 each() 中获取选定的类 - 或者将正则表达式应用于 $.removeClass()。谁能指出我正确的方向?

更新:是否有任何类型的 $.removeClass([selected]) 功能?这似乎是解决第二部分的最简单方法。

4

6 回答 6

20

如果只有数字是可以接受的,但也可以有其他字符,我会从这样的东西开始(未经测试,但在评论的帮助下编辑):

$("[class^='table-col-']").removeClass( function() { /* Matches even table-col-row */
     var toReturn = '',
         classes = this.className.split(' ');
     for(var i = 0; i < classes.length; i++ ) {
         if( /table-col-\d{1,3}/.test( classes[i] ) ) { /* Filters */
             toReturn += classes[i] +' ';
         }
     }
     return toReturn ; /* Returns all classes to be removed */
});
于 2013-03-25T15:10:21.850 回答
5

您可以这样做,而无需将类名拆分为数组。让正则表达式完成所有工作。

对于找到的每个元素,删除与正则表达式匹配的所有类。

$("[class^='table-col-']").removeClass( function() {
    return (this.className.match(/\b(table-col-\d{1,3})\b/g) || []).join(' ');
})

于 2015-09-01T16:41:53.203 回答
1

试试这个:

http://jsfiddle.net/aidioo7/AmK4a/1/

JS:-

$(function () {
    $("div").filter(function() {
        return this.className.match(/table-col-\d{0,3}/);
    }).each(function(){
        var classToRemove=this.className.match(/table-col-\d{0,2}/)[0];
        $(this).removeClass(classToRemove);
    });
});

示例 HTML:-

<div class="table-col-0 temp">Test0</div>
<div class="table-col-99">Test99</div>
<div class="table-col-999">Test999</div>

输出 HTML:-

<div class="temp">Test0</div>
<div class="">Test99</div>
<div class="table-col-999">Test999</div>
于 2013-03-25T15:32:23.937 回答
1

尝试这个:

$.fn.removeClassRegExp = function (regexp) {
    if(regexp && (typeof regexp==='string' || typeof regexp==='object')) {
        regexp = typeof regexp === 'string' ? regexp = new RegExp(regexp) : regexp;
        $(this).each(function () {
            $(this).removeClass(function(i,c) { 
                var classes = [];
                $.each(c.split(' '), function(i,c) {
                    if(regexp.test(c)) { classes.push(c); }
                });
                return classes.join(' ');
            });
        });
    }
    return this;
};

直播:http: //jsfiddle.net/Z3D6P/

于 2014-02-27T17:16:54.100 回答
0

这个问题现在很老了,但如果其他人遇到它......

我创建了一个简单的插件jquery.classMatch它提供

$(selector).hasClassMatch(regexp)
$(selector).removeClassMatch(regexp)
于 2014-04-30T21:59:45.920 回答
0

try

var className = 'table-col-';
$('[class^='+className+']').removeClass(function(index, class) {
    return class.indexOf(className) == 0;
});

see http://api.jquery.com/removeClass/ and http://api.jquery.com/attribute-starts-with-selector/

edited:

var className = 'table-col-';
$('[class^='+className+']').removeClass(function(index, c) {
    var elem = $(this);
    $(c.split(' ')).each(function() {
        var c = this.trim();
        if(this.indexOf(className)==0) {
            elem.removeClass(c);
        }
    });
});
于 2013-03-25T15:03:44.403 回答