Question

用js/jq或css循环为li添加不同的背景图片

我这有一组12个li标签，我想为这12个标签添加不同的背景图片，来展示不同的分类，用css样式的li:nth-child(n){background:url(xxxx);}当然可以实现，但是这样会重复很多没必要的代码，可以用循环的方式来加载背景图吗，我把不同的图排成1到12.jpg的样子，用循环来取，求解怎么做啊？

Answer 1

var list = document.getElementsByTagName('li');
for(var i = 0; i < list.length; i++) {
    list[i].style.backgroundImage = i+'.jpg';
}

 以上是你做12张图片的情况。

还有一种是把12张图片整合到一张图片上，前提是这12张图片高度最好一致

样式就用

li{background:url(sprites.jpg) no-repeat; height:固定好高度}

代码用

list[i].style.backgroundPosition = '0 ' + (间隔高度) * i + 'px';