总是要趁着自己还有记忆的时候,把该记录下来的都记录下来,着实是不敢恭维自己的记性。
相信很多时候,我们前端人员,经常会用到table里面的某个td中还嵌套着table,而这个时候还总要去弄奇偶行的颜色,里面那个嵌套的table也要弄。
今天就是这样。如果只是单纯弄最外层的table还好一点。
闲话不多说,先贴个效果图把。
当然我不会把全部的代码都贴出来,相信大家也写得出来。
首先最外层的table,我们给它一个class="even_a_mid",给最外层的奇偶行赋予颜色
$(".even_a_mid tr:even").css("background","#eee");
然后给里面的table赋予颜色,开始需求人员说,这个里面嵌套一个table,所以我的写法是这样的。期间,是遇到一个问题的——$(".even_a_mid tr:eq(index) table tr:even").css("background","red");当我这样写时,就没有效果。原因是——eq作为选择器的时候不支持变量,只支持大于等于0的正整数。当你用变量,负数,小数的时候,程序都会把它转换成0。故而改了下面就ok了。
var index = $(".even_a_mid tr").has("table").index(); $(".even_a_mid tr:eq(‘"+index+"‘) table tr:even").css("background","red");
事实上,如果里面嵌套多个table,后面的基本没用了。因为$(".even_a_mid tr").has("table")这部分是一个数组,所以index方法则无效了。接下来要做的事情是,要得到遍历这个数组,等得到每行的index,然而事与愿违。所以换了种方式。
$(".even_a_mid tr").has("table").each(function() { $(this).find("table tr:even").css("background","#fff"); $(this).find("table tr:odd").css("background","#eee"); });
最后终于就ok了。