js 动态加载table的tr并隔行换色(变色)的实现代码

1、html代码

<table style="BORDER-COLLAPSE:collapse" cellSpacing=0 width=600 align=center  border=1 cellpadding="0" bordercolor="#CCCCCC">
  <tr>
    <td width="200px;">a</td>
    <td width="200px;">sd</td>
     <td width="200px;">asdf</td
  </tr>
  <tr>
    <td width="200px;">b</td>
    <td width="200px;">a</td>
     <td width="200px;">a</td
  </tr>
  <tr>
    <td width="200px;">c</td>
    <td width="200px;">a</td>
     <td width="200px;">a</td
  </tr>
   <tr>
    <td width="200px;">c</td>
    <td width="200px;">a</td>
     <td width="200px;">a</td
  </tr>
   <tr>
    <td width="200px;">c</td>
    <td width="200px;">a</td>
     <td width="200px;">a</td
  </tr>
</table>

2、js代码

<script language="javascript:>
function fun(){
var tr=document.getElementsByTagName("tr");
for(var i=0;i<tr.length;i++)
{
  tr[i].style.background=tr[i].rowIndex % 2==0?"#F0FFF0":"white";
  }
}
window.onload=fun;
</script>

效果如下图所示，当然具体的样式，自己可以好好修饰下。

备注：
rowIndex 用于判断当前单元格所处行的索引（从0开始）
cellIndex 用于判断当前单元格所处列的索引（从0开始）