表格隔行换色，鼠标经过行变换背景颜色效果代码
<style language="text/css">
/*第一种颜色*/
#table tr.color1{
background-color:#FFFFFF;
}
/*第二种颜色*/
#table tr.color2{
background-color:#F8F8F8;
}
</style>
<script type="text/javascript">
<!--
function onloadEvent(func){
var one=window.onload
if(typeof window.onload!='function'){
window.onload=func
}
else{
window.onload=function(){
one();
func();
}
}
}
function showtable(){
var tableid='table'; //表格的id
var overcolor='#FCF9D8'; //鼠标经过颜色
var color1='#FFFFFF'; //第一种颜色
var color2='#F8F8F8'; //第二种颜色
var tablename=document.getElementById(tableid)
var tr=tablename.getElementsByTagName("tr")
for(var i=1 ;i<tr.length;i++){
tr[i].onmouseover=function(){
this.style.backgroundColor=overcolor;
}
tr[i].onmouseout=function(){
if(this.rowIndex%2==0){
this.style.backgroundColor=color1;
}else{
this.style.backgroundColor=color2;
}
}
if(i%2==0){
tr[i].className="color1";
}else{
tr[i].className="color2";
}
}
}
onloadEvent(showtable);
-->
</script>
<table width="100%" border="0" cellspacing="1" cellpadding="4" class="list" name="table" id="table">
<thead>
<tr>
<th>流程</th>
<th>启动人</th>
<th>启动时间</th>
<th>状态</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
<tr>
<td><a href="#">测试行</a></td>
<td>无</td>
<td>2008-05-09 17:21:04</td>
<td>结束</td>
</tr>
</tbody>
</table>