为了使表格该生产线是较为突出,结构更清晰。我们能够奇数或偶数行添加背景颜色
<!doctype html> <html> <head> <meta charset="utf-8"> <title>jquery test</title> <script src="jquery-1.11.1.min.js"></script> <style type="text/css"> .color { background-color:#1abc9c; } </style> </head> <body> <table border="1"> <caption class="text-center">信息统计表</caption> <thead> <tr > <th>#</th> <th>Firstname</th> <th>Lastname</th> <th>Phone</th> <th>QQ</th> </tr> </thead> <tbody> <tr class="error"> <td>1</td> <td>qian</td> <td>shou</td> <td>11111111111</td> <td>111111111</td> </tr> <tr class="warning"> <td>2</td> <td>qian</td> <td>shou</td> <td>11111111111</td> <td>111111111</td> </tr> <tr class="info"> <td>3</td> <td>qian</td> <td>shou</td> <td>11111111111</td> <td>111111111</td> </tr> <tr class="success"> <td>4</td> <td>qian</td> <td>shou</td> <td>11111111111</td> <td>111111111</td> </tr> </tbody> </table> <script type="text/javascript"> $("table tbody tr:even").addClass("color"); </script> </body> </html>
核心代码:
$("table tbody tr:even").addClass("color");
效果图:
版权声明:本文博客原创文章。博客,未经同意,不得转载。
本文转自mfrbuaa博客园博客,原文链接:http://www.cnblogs.com/mfrbuaa/p/4650196.html,如需转载请自行联系原作者