Question

鉴于此HTML：

<div id="foo">
    <input type=button class="foo abtn_1">
    <input type=button class="joe bbtn_2">
    <input type=button class="doe cbtn_2">
    <input type=button class="joe dbtn_1">
    <input type=button class="foo ebtn_2">
</div>

点击后，我希望使用下划线和数字来获取班级的第一部分。

所以从第一个输入我得到：abtn

目前我使用：

$('#foo input').on('click', function () {
    var a = $(this).attr('class')
                   .replace('foo','')
                   .replace('joe','')
                   .replace('doe','')
                   .replace('_1','')
                   .replace('_2','')

console.log(a);

});

我认为应该有一个更强大，更快速的性能方式来实现这一点可能与Regex？

Answer 1

您可以使用正则表达式直接查找正确类名的正确部分，而无需进行任何替换：

$('#foo input').on('click', function () {
    var match = this.className.match(/(^|\s)([^\s_]+)_\d(\s|$)/);
    if (match) {
        var item = match[2];
        // do what you want with item here
    }
});

此处的演示演示：http://jsfiddle.net/jfriend00/EDrvJ/

这是正则表达式的解释：

(^|\s)    Match starting with either the start of the string ^ or whitespace \s
([^\s_]+) After that, match any number of characters that are not whitespace and not underscore and capture this match
_\d       After that, match an underscore and any digit
(\s|$)    After that, match whitespace or the end of the string

开头的(^|\s)和(\s|$)结尾确保我们获得的是整个班级名称匹配，而不仅仅是部分匹配。 |符号在正则表达式中为OR，因此我们可以将^或\s与(^|\s)匹配。

Answer 2

它不是jquery替换，它是通用的javascript字符串替换

使用正则表达式可能看起来像：

var a = $(this).attr('class').replace(/(foo|joe|doe|_1|_2)/g, '');

如果你需要通用的东西

我想用下划线和数字来获得班级的第一部分。

然后使用

var a = $(this).attr('class').match(/\b([^ _]+?)_\d/, '');

Answer 3

根据this test，我建议你使用split（）函数，请更正句子“我想用下划线和数字来获得班级的第一部分。” ，你的功能不是你所强调的那样

假设您需要课程的第一部分没有数字和下划线：

 $('#foo input').on('click', function () {
    var a = $(this).attr('class').split('_');
    console.log(a[0]);
   });

使用Regex VS jQuery替换

3 个答案: