效果:
代码:
复制代码代码如下:
<头runat =“服务器”>
<标题></标题>
<脚本类型=“文本/javascript”>
window.onload = 函数() {
var otab = document.getElementById('tab1');
var thiscolor = '';
for (var i = 0; i < otab.tBodies[0].rows.length; i++) {
otab.tBodies[0].rows[i].onmouseover = 函数 () {
thiscolor = this.style.background;
this.style.background = '#00FFFF';
};
otab.tBodies[0].rows[i].onmouseout = 函数 () {
this.style.background = thiscolor;
};
如果(我%2){
otab.tBodies[0].rows[i].style.background = '';
}
别的 {
otab.tBodies[0].rows[i].style.background = '#FFFF00';
}
}
};
</脚本>
</头>
<正文>
<table id="tab1" style="text-align: center; width: 500px; margin: 200px auto">
<标题>
<tr style="background-color: #FF0000">
<td>
种族名称
</td>
<td>
种族名称
</td>
<td>
英雄
</td>
</tr>
</标题>
<正文>
<tr>
<td>
人类联盟
</td>
<td>
哼
</td>
<td>
特色英雄:AM
</td>
</tr>
<tr>
<td>
兽人部落
</td>
<td>
兽人
</td>
<td>
特色英雄:BM
</td>
</tr>
<tr>
<td>
不死亡灵
</td>
<td>
UD
</td>
<td>
特色英雄:DK
</td>
</tr>
<tr>
<td>
暗夜精灵
</td>
<td>
东北
</td>
<td>
特色英雄:DH
</td>
</tr>
</tbody>
</表>
</正文>