jquery - 查找元素中类名的其他属性

Question

我有以下代码:

<div class="_GAb-_GAd">
    <div class="_GANmb _GAe ACTION-removeFilter TARGET-1">clear</div>
</div>

<div class="_GAb-_GAd">
    <div class="_GANmb _GAe ACTION-removeFilter TARGET-2">clear</div>
</div>

和脚本(Jquery)

<script>
    $(document).ready(function() {
        $(".ACTION-removeFilter").click(function() {
            alert('find out which TARGET is being clicked.');
        });
    });
</script>

我想知道正在单击哪个目标(TARGET-1 或 TARGET-2)。有办法查到吗？

我怎么知道？

Answer 1

您可以在 className 上使用正则表达式

var target = $(this).attr('class').match(/\b(TARGET-[^ ]+)/)[1];

Regex Demo and Explanation

1. \b:字边界
2. ():捕获组。可以使用数组的第二个索引(1)来访问
3. TARGET-:字面匹配 TARGET-
4. [^]*:^:不是。匹配非空格的任何内容，零次或多次。

注意:要不区分大小写地匹配，请使用 i 标志。我假设 - 之后总会有一些东西，所以使用了 +。

演示:

$(document).ready(function() {
  $(".ACTION-removeFilter").click(function() {
    console.log($(this).attr('class').match(/\b(TARGET-[^ ]+)/)[1]);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div class="_GAb-_GAd">
  <div class="_GANmb _GAe ACTION-removeFilter TARGET-1">clear</div>
</div>

<div class="_GAb-_GAd">
  <div class="_GANmb _GAe ACTION-removeFilter TARGET-2">clear</div>
</div>

<div class="_GAb-_GAd">
  <div class="_GANmb _GAe ACTION-removeFilter TARGET-My_Beautiful_class_488">Check this</div>
</div>