Question

之前可能已经回答过，但我不知道如何正确地说出来。

对于元素：

<div id='div1' class="class1 1foobar"></div>
<div id='div2' class="class1 class2 2foobar"></div>

如何获得以'foobar'结尾的班级的名称？所以对于'div1'我想要一个字符串'1foobar'和'div2'我想得到字符串'2foobar'。

Answer 1

选择class属性值包含所需字符串的所有元素。 $('[class*="foobar"]')选择器会选择foobar属性值中class所在的所有元素。
filter类名以此结尾的元素。使用filter()和RegEx /foobar\b/会过滤掉其类/ es以 foobar 字符串结尾的元素。

请注意，正则表达式中的\b为word boundary。

＆＃13;

$('[class*="foobar"]').filter(function() {
    return /foobar\b/.test($(this).attr('class'));
}).css('background', 'green');

＆＃13;

div {
  height: 50px;
  width: 50px;
  margin: 5px;
  background: red;
  float: left;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="class2 2foob ar"></div>
<div id='div1' class="class1 1foobar"></div>
<div id='div2' class="class1 class2 2foobar"></div>

<div class="class1 class2 2foo bar"></div>

＆＃13;

获取班级名单

在foobar属性值中的任意位置选择包含class的元素。
使用match()获取className（如果包含它）。
match()将返回null，否则它将返回包含匹配项的数组。第一项（在第零个索引）是感兴趣的类名。

$('[class*="foobar"]').each(function () {
    var className = $(this).attr('class').match(/\S*foobar\b/i);
    if (className) {
        console.log(className[0]);
    }
});

＆＃13;

$('[class*="foobar"]').each(function() {
  var className = $(this).attr('class').match(/\S*foobar\b/i);
  if (className) {
    console.log(className[0]);
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="class2 2foob ar"></div>
<div id='div1' class="class1 1foobar"></div>
<div id='div2' class="class1 class2 2foobar"></div>

<div class="class1 class2 2foo bar"></div>

＆＃13;

选择其类以特定字符串

1 个答案: