Question

我有多个类的span标签：

 <div class="container">
 <span class="otherclass item3">Text</span>
 <span class="otherclass item1">Blah</span>
 <span class="item2">Stuff</span>
 </div>

我有兴趣用前缀为'item'的类来计算span元素的数量。我知道我可以这样做：

 $(document).on('click','span',function(){
 var ItemTot = $(this).closest('.container').find('[class*= item]').length;
 alert(ItemTot);
 }

...计算具有多个类的span元素的数量，但这不会计算单个类的跨度。我可以通过下面的代码得到它，但肯定有一种更简洁的方法来计算两种情况吗？

 .find('[class^=item]').length;

Answer 1

CSS缺少“单词开头”属性选择器。（它的属性以[^=]开头，并且它与单词匹配[~=]，但不匹配组合一句话的开头。）

所以你必须手动完成：Live Copy | Live Source

var ItemTot = $(this).closest('.container').find('[class*=item]').filter(function() {
    return this.className.match(/\bitem/);
}).length;

找到class属性包含item（任意位置）的任何元素，然后仅基于item是单词开头的那些元素进行过滤。

Answer 2

你最干净的选择是$('span[class~="item"]').length

alert($('span[class~="item"]').length);

示例：http://jsfiddle.net/sPNLW/1/

请参阅http://api.jquery.com/category/selectors/attribute-selectors/ $('span[class~="item"]')在spans属性中找到包含item的所有class。

如何在jquery中找到多个类的类前缀？

2 个答案: