[英]How to select elements with a specific array length
在每個函數中 ,我在DOM中搜索具有特定className的許多元素。 根據其長度,此ClassName將創建一個長2或4的數組 。
我需要分別選擇這兩種類型的元素,以便采取不同的行動。
我怎樣才能做到這一點?
<div class="foo-1"></div>
<div class="foo-1"></div>
<div class="foo-1-boo-2"></div>
jQuery的
$( '[class*=foo-]' ).each(function() {
var foo = $( this );
var fooArray = foo.attr( 'class' ).split( '-' );
var arrayLength = fooArray.length;
});
控制台將返回3個元素 ,其中兩個元素的長度為2 ,一個元素的長度為4 。
我需要將這兩個結果分開,以使它們的行為有所不同,因為它們是變量。
我需要類似的東西:
var caseA = (foo with an arrayLength === 2);
var caseB = (foo with an awwayLength === 4);
一種可能的方法是將.filter
方法與函數一起用作參數:
var elements = $('[class*=foo-]'),
caseA = elements.filter(function() {
return this.className.split('-').length === 2;
}),
caseB = elements.filter(function() {
return this.className.split('-').length === 4;
});
console.log(caseA.length, caseB.length);
我猜想您希望將它們作為jQuery集而不是數組,以便您可以輕松地與jQuery一起操作它們。 所以這樣做:
var caseA = $('[class*=foo-]').filter(function() {
return $(this).attr("class").split("-").length === 2;
});
var caseB = $('[class*=foo-]').filter(function() {
return $(this).attr("class").split("-").length === 4;
});
如果您有大量的元素並且事實證明它很慢,則可以通過使其更加復雜並使用each
元素而不是過濾器來對其進行稍微優化。 但是,除非證明有必要,否則我不會打擾。
另一種可能的方法是只使用條件語句-
$('[class*=foo-]').each(function () {
var foo = $(this);
var fooArray = foo.attr('class').split('-');
var arrayLength = fooArray.length;
(2 == arrayLength ? console.log('to do something') : '');
(4 == arrayLength ? console.log('do something for') : '');
});
我在這篇文章的評論中混合了兩種解決方案:
var caseA = col.filter(function() {
return this.className.split( '-' ).length === 2;
});
var caseB = col.filter(function() {
return this.className.split( '-' ).length === 4;
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.