Full code:
<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 () {
Query button
Odd Air color change
$ ("#table1 Tr:even"). AddClass ("Red2");
});
</script>
<table id= "table1" class= "Table table-bordered" >
<tr>
<th> Staff id</th>
<th class= "width100" > Work No. </th>
<th> name </th>
<th> Sex </th>
<th> Date of birth </th>
<th> Professional </th>
<th> Education </th>
<td> Operations </td>
</tr>
<tr >
<td> Get </td>
<td> but </td>
<td>23</td>
<td> Get </td>
<td> but </td>
<td>12</td>
<td>23</td>
<td>33</td>
</tr>
<tr >
<td> Get </td>
<td> but </td>
<td>23</td>
<td> Get </td>
<td> but </td>
<td>12</td>
<td>23</td>
<td>33</td>
</tr>
<tr >
<td> Get </td>
<td> but </td>
<td>23</td>
<td> Get </td>
<td> but </td>
<td>12</td>
<td>23</td>
<td>33</td>
</tr>
</table>
The first step is to introduce the Jque.js package
<script type= "Text/javascript" src= "Js/jquery-1.9.1.min.js" ></script>
The second step is to write table
<table id= "table1" class= "Table table-bordered" >
<tr>
<th> Staff id</th>
<th class= "width100" > Work No. </th>
<th> name </th>
<th> Sex </th>
<th> Date of birth </th>
<th> Professional </th>
<th> Education </th>
<td> Operations </td>
</tr>
<tr >
<td> Get </td>
<td> but </td>
<td>23</td>
<td> Get </td>
<td> but </td>
<td>12</td>
<td>23</td>
<td>33</td>
</tr>
<tr >
<td> Get </td>
<td> but </td>
<td>23</td>
<td> Get </td>
<td> but </td>
<td>12</td>
<td>23</td>
<td>33</td>
</tr>
<tr >
<td> Get </td>
<td> but </td>
<td>23</td>
<td> Get </td>
<td> but </td>
<td>12</td>
<td>23</td>
<td>33</td>
</tr>
</table>
</div>
The third step is to realize the event;
<script type= "Text/javascript" >
$ (function () {
Query button
Odd Air color change
$ ("#table1 Tr:even"). AddClass ("Red2");
});
</script>
Fourth step: Add CSS:
<style type= "Text/css" >
. red2 {
Background: #eeeeee;
}
</style>