我使用的jQuery版本为jquery-3.3.1.js,下载地址:https://code.jquery.com/jquery-3.3.1.js
我使用的Chrome版本为 Version 63.0.3239.132 (Official Build) (64-bit)
使用jQuery实现的表单隔行变色,参考《jQuery权威指南》P33页代码段。
<html>
<head>
<title>jQuery学习</title>
<!--隔行变色-->
<style type="text/css">
body{font-size:12px;text-align:center}
#tbl {width:300px;border:solid 1px #666; background-color:#eee}
#tbl tr{line-height:23px}
#tbl tr th{background-color:#ccc;color:#fff}
#tbl .trOdd{background-color:#fff}
</style>
</head>
<body>
<table border="1" id="tbl">
<tr>
<th></th>
<th>第一列</th>
<th>第二列</th>
<th>第三列</th>
<th>第四列</th>
</tr>
<tr><td>第一行</td><td>A1</td><td>A2</td><td>A3</td><td>A4</td></tr>
<tr><td>第二行</td><td>B1</td><td>B2</td><td>B3</td><td>B4</td></tr>
<tr><td>第三行</td><td>C1</td><td>C2</td><td>C3</td><td>C4</td></tr>
<tr><td>第四行</td><td>D1</td><td>D2</td><td>D3</td><td>D4</td></tr>
<tr><td>第五行</td><td>E1</td><td>E2</td><td>E3</td><td>E4</td></tr>
</table>
<script src="jquery-3.3.1.js"></script>
<script>
$(function(){
$("#tbl tr:nth-child(even)").addClass("trOdd");
});
</script>
</body>
</html>
END