用jquery技术实现table的奇数行变色

完整代码：

<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>

<style type="text/css">

.red2 {
background: #eeeeee;
}

</style>

<script type="text/javascript">
$(function(){
//查询按钮
//奇数航变色
$("#table1 tr:even").addClass("red2");
});

</script>

<table  id="table1"  class="table table-bordered" >
 <tr>
                            <th>员工ID</th>
                            <th class="width100">工号</th>
                            <th>姓名</th>
                            <th>性别</th>
                            <th>出生日期</th>
                            <th>专业</th>
                            <th>学历</th>
                            <td>操作</td>
                        </tr>
                    
                        <tr >
                         <td>得到</td>
                         <td> 但是</td>
                         <td>23</td>
                         <td>得到</td>
                         <td>但是</td>
                         <td>12</td>
                         <td>23</td>
                         <td>33</td>
                        </tr>

                        <tr >
                         <td>得到</td>
                         <td> 但是</td>
                         <td>23</td>
                         <td>得到</td>
                         <td>但是</td>
                         <td>12</td>
                         <td>23</td>
                         <td>33</td>
                        </tr>

                        <tr >
                         <td>得到</td>
                         <td> 但是</td>
                         <td>23</td>
                         <td>得到</td>
                         <td>但是</td>
                         <td>12</td>
                         <td>23</td>
                         <td>33</td>
                        </tr>
                 
</table>

第一步要引入jque.js包

<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>

第二步写table

<table  id="table1"  class="table table-bordered" >
 <tr>
                            <th>员工ID</th>
                            <th class="width100">工号</th>
                            <th>姓名</th>
                            <th>性别</th>
                            <th>出生日期</th>
                            <th>专业</th>
                            <th>学历</th>
                            <td>操作</td>
                        </tr>
                    
                        <tr >
                        <td>得到</td>
                        <td> 但是</td>
                        <td>23</td>
                        <td>得到</td>
                        <td>但是</td>
                        <td>12</td>
                        <td>23</td>
                        <td>33</td>
                        </tr>

                        <tr >
                         <td>得到</td>
                         <td> 但是</td>
                         <td>23</td>
                         <td>得到</td>
                         <td>但是</td>
                         <td>12</td>
                         <td>23</td>
                         <td>33</td>
                        </tr>

                        <tr >
                         <td>得到</td>
                         <td> 但是</td>
                         <td>23</td>
                         <td>得到</td>
                         <td>但是</td>
                         <td>12</td>
                         <td>23</td>
                         <td>33</td>
                        </tr>
                 
</table>
</div>
第三步;实现事件；

<script type="text/javascript">
$(function(){
//查询按钮
//奇数航变色
$("#table1 tr:even").addClass("red2");
});

</script>

第四步：添加css:

<style type="text/css">

.red2 {
background: #eeeeee;
}

</style>