如果id以偶数结尾,我想将一个类应用于具有特定id的每个div。此外,我想将一个不同的类应用于以奇数结尾的类。理想情况下,如果可以通过jquery实现这一点,那就太棒了。
这是一个例子。我想在id为“item1”的所有div中添加“Red”类,其中最终的数字是奇数。所以“红色”类将应用于item1,item3,item5。
同样地,我想为所有具有id“item2”的div添加“Green”类,其中最终的数字是偶数。因此,类“绿色”将应用于item2,item4,item6。
谢谢,非常感谢任何帮助!
答案 0 :(得分:4)
如果没有,你可以循环使用它们:
$('div').each(function(d) {
num = Number( /\d+$/.exec( d.attr('id') )[0] );
if (isNaN(num)) return;
d.addClass(num % 2 == 0 ? 'even' : 'odd');
});
或更多jQuery-sh:
$('div')
.filter(function(d) { return /[02468]$/.test( d.attr('id') ); })
.addClass('even');
$('div')
.filter(function(d) { return /[13579]$/.test( d.attr('id') ); })
.addClass('odd');
答案 1 :(得分:0)
您可以使用jquery正则表达式 - 请参阅this question。
答案 2 :(得分:0)
function doStuff(baseId, evenClassName, oddClassName) {
$('[id^=' + baseId + ']').each(function() {
var $this = $(this);
var number = $this.attr('id').replace(baseId, "");
$this.addClass(number % 2 == 0 ? evenClassName : oddClassName);
});
}
$(document).ready(function() {
doStuff("item", "Green", "Red");
});
注意:未经测试
史蒂夫在评论中指出你可以使用:奇数和:甚至是jQuery选择器,但如果是这样,那么为什么不使用CSS:nth-child伪选择器:
<div id="mystuff">
<div id="item1" class="item"></div>
<div id="item2" class="item"></div>
<div id="item3" class="item"></div>
</div>
#mystuff .item {
/* your default and odd styles here */
}
#mystuff .item:nth-child(2n+1) {
/* your even styles here */
}
答案 3 :(得分:0)
$('[id^=id-start-][id$=0],'
+ '[id^=id-start-][id$=2],'
+ '[id^=id-start-][id$=4],'
+ '[id^=id-start-][id$=6],'
+ '[id^=id-start-][id$=8]').addClass('myClass');