效果图.png
代码如下 (需引入jq)
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script type="text/javascript" src='./jquery.js'></script>
<title>Document</title>
</head>
<body>
<table id='table' align="center" width="70%" rules="all" cellspacing="0" cellpadding="2" border="1">
<thead>
<tr>
<th>ID</th>
<th>姓名</th>
<th>绰号</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>宋江</td>
<td>及时雨</td>
</tr>
<tr>
<td>2</td>
<td>卢俊义</td>
<td>玉麒麟</td>
</tr>
<tr>
<td>3</td>
<td>吴用</td>
<td>智多星</td>
</tr>
<tr>
<td>4</td>
<td>鲁智深</td>
<td>花和尚</td>
</tr>
<tr>
<td>5</td>
<td>林冲</td>
<td>豹子头</td>
</tr>
</tbody>
</table>
<script>
//找到id=table下面的奇数的tr,批量都设置背景色为#16E8D4
$("#table tbody > tr:even").css('background-color','#16E8D4');
/*var trs = document.getElementsByTagName('tr');
for(var i=1; i<trs.length; i++){
if(i%2 == 1){
trs[i].style.backgroundColor = '#666';
}
}*/
</script>
</body>
</html>
网友评论