<body>
<table style="600px;" border="1" cellspacing="0" cellpadding="0">
<tbody id="tbody">
<tr>
<td>序号1</td>
<td>张三</td>
<td>28</td>
<td>保定</td>
</tr>
<tr>
<td>序号1</td>
<td>张三</td>
<td>28</td>
<td>保定</td>
</tr>
<tr>
<td>序号1</td>
<td>张三</td>
<td>28</td>
<td>保定</td>
</tr>
<tr>
<td>序号1</td>
<td>张三</td>
<td>28</td>
<td>保定</td>
</tr>
<tr>
<td>序号1</td>
<td>张三</td>
<td>28</td>
<td>保定</td>
</tr>
</tbody>
</table>
</body>
<script>
var tbody = document.getElementById('tbody').children
for(let i = 0; i < tbody.length;i++){
if(i % 2 == 0){
tbody[i].style.backgroundColor = 'pink'
}else{
tbody[i].style.backgroundColor = 'blue'
}
var myColor = ''
tbody[i].onmouseover = function(){
myColor = this.style.backgroundColor
this.style.backgroundColor = '#ccc'
}
tbody[i].onmouseout = function(){
this.style.backgroundColor = myColor
}
}
</script>