Question

jquery li循环 样式递增变化

<div class="bd">
<ul>
<li><span>1</span><span>2</span><span>3</span></li>
</ul>
<ul>
<li><span>1</span><span>2</span><span>3</span></li>
</ul>
<ul>
<li><span>1</span><span>2</span><span>3</span></li>
</ul>
</div>

代码结构如上，想让每个li的span的background-position属性按次数变化，span1是 0 -36， span2 是 0 -72
这种，用jquery应该比js简单些吧，求教，没多少分了

Answer 1

索引值乘以基数即可。

$('.bd li').each(function(i){
   $(this).css({'background-position' : '0px '+ i*36 +'px'}); 
});

这样，他的样式就会是：0-0，0-36，0-72...

如果希望他第一个是0-36，则可以把i*36改为（i+1）*36

追问

哦，sorry，代码结构有点错误，是这样的，
123
这种，li和span一样多

哦，sorry，代码结构有点错误，是这样的，
123
这种，li和span一样多

追答

我看错了，呵呵

$('.bd li').each(function(){
    $(this).find('span').each(function(i){
        $(this).text((i+1)*36);
    }); 
});

改为当前li下的span就可以了~自己试了下，得两个遍历~

追问

1不要加背景
2不要加背景

只循环都第一个ul，有好几个，谢谢

追答

//第一个UL下的li
$('.bd ul:first li').each(function(i){
    //第一个li下的span
    $(this).find('span:first').css({'background-position' : '0px -'+ (i*36) +'px'});
});

这样试试