jquery4选择器【实现隔行变色】

2024-04-27 15:00:41

字体：大中小

来源：转载

供稿：网友

<!DOCTYPE html>
<html>
<head>
<title>Accordion Menus</title>
<style type="text/CSS">
   body{font-size:12px;text-align:center}
   #tbStu{width:260px;background-color:#eee}
   #tbStu .trOdd{background-color:#6E7B8B}
</style>
<script language="javascript" src="jquery-2.1.1.js"> </script>
<script language="Javascript" type="text/javascript" >
    $(function(){

　　　//:nth-child(n) 第n个子节点，n从1开始;:even 页面范围内偶数的匹配元素
        $("#tbStu tr:nth-child(even)").addClass("trOdd");
    });

</script>
</head>
<body>
   <table id="tbStu">
   <tr><td>姓名</td><td>学号</td><td>年龄</td></tr>
   <tr><td>王杰</td><td>201208373</td><td>26</td></tr>
   <tr><td>程灿</td><td>201208377</td><td>26</td></tr>
   <tr><td>陈晨</td><td>201208365</td><td>24</td></tr>
   </table>
</body>

</html>