|
|
<script type="text/javascript"> window.onload=function(){ var table=document.getElementById("tb"); var tboby=table[0]; var trs=document.getElementsByTagName("tr"); for(var i=0;i<trs.length;i++){ if(i%2==0){ trs.style.color="#3333ff"; //设置偶数行字体的颜色 }else{ trs.style.background="#99ffff"; //设置奇数行的背景色 } } };</script></head><body><table id="tb"> <tbody> <tr><td>第一行</td><td>第一行</td></tr> <tr><td>第二行</td><td>第二行</td></tr> <tr><td>第三行</td><td>第三行</td></tr> <tr><td>第四行</td><td>第四行</td></tr> <tr><td>第五行</td><td>第五行</td></tr> <tr><td>第六行</td><td>第六行</td></tr> </tbody></table></body> 注: 设置行的背景色也可以这样写 trs.style.backgroundColor="#99ffff"; //设置偶数行的背景色
下面是jquery实现相同的功能
<script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script><script type="text/javascript">$(function(){$("#tb tbody tr:even").css("color","#3333ff");$("#tb tbody tr:odd").css("background","#99ffff");});</script></head><body><table id="tb"><tbody><tr><td>第一行</td><td>第一行</td></tr><tr><td>第二行</td><td>第二行</td></tr><tr><td>第三行</td><td>第三行</td></tr><tr><td>第四行</td><td>第四行</td></tr><tr><td>第五行</td><td>第五行</td></tr><tr><td>第六行</td><td>第六行</td></tr></tbody></table></body>注: 这里当然也可以写 $("#tb tbody tr:odd").css("backgroundColor","#99ffff"); |
|
京ICP备14020293号-2
本网站内容均收集于互联网，如有问题请联系QQ:389897944予以删除
窥视卡
雷达卡
楼主
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
显身卡