
正文
jq 个性的隔行变色
提示:扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
效果图大致这样:

我的html格式部分这样:
/*不过他们都说我的dom结构不太合理,同意。BUT,我就是不想写表格而写成的这样的,所以后面jq部分也要迁就了*/
<div class="pro_detail">
<!-- 列表详细信息 -->
<ul>
<li>001</li>
<li>椰香奶茶</li>
<li>¥ 10.00</li>
<li>¥ 10.50</li>
<li>-5%</li>
</ul>
</div>
下面是JQ代码部分(插入进来变得红红的是啥意思?):
//变色效果
function oChange(){
var oUl = $(".pro_detail ul").length;
for ( var t =0; t<oUl ;t++){ //原来的颜色
$(".pro_detail ul").eq(t).find('li').eq(3).css({
"color" : "blue"
});
$(".pro_detail ul").eq(t).find('li').eq(4).css({
"color" : "blue"
});
}//for
for ( var a =0; a<oUl ;a++){
var s = Math.floor(a%2)+1;
if(s){
a = a+2;//隔两个变色
$(".pro_detail ul").eq(a).find('li').eq(3).css({
"color" : "red"
});
$(".pro_detail ul").eq(a).find('li').eq(4).css({
"color" : "red"
}); }//if
} //for } oChange();
对jq还不太熟,用很蹩脚的方法写成了这样,可能要贻笑大方之家。有重复的代码,比如,第三个li和第四个li变色的那个地方,我是直接复制的一样的。但是,现在还不知道怎样优化呢?就先这样吧。大神告诉我说,jq里面循环不要用for,用each比较好?
然后,贴上大神的指导。虽然看得半懂不懂 (●˘◡˘●)








