Use JavaScript to complete the color change of the table

full code

1  <! DOCTYPE html > 
2  < html > 
3  
4      < head > 
5          < meta charset ="utf-8"  /> 
6          < title > JS implements form interlace color change </ title > 
7  
8          < script > 
9              // onload Page load event 
10              function show(){
 11                  // Get the number of rows of the tbody tag 
12                  var len = document.getElementById( " tb1 " ).tBodies[0 ].rows.length;
 13                  // The for loop traverses the number of rows and realizes the color change of the number of odd and even rows 
14                  for ( var i =  0 ; i < len; i ++ ) {
 15                      if (i %  2  ==  0 ) {
 16                          document.getElementById( " tb1 " ).tBodies[ 0 ].rows[i].style.backgroundColor =  " gold " ;
 17                      } else {
 18                          document.getElementById( "tb1 " ).tBodies[ 0 ].rows[i].style.backgroundColor =  " white " ;
 19                      }
 20                  }
 21              }
 22          </ script > 
23      </ head > 
24  
25      < body onload ="show()" > 
26          <!-- Funny is for friends, mature is for strangers, naive is for those who like it! --> 
27          < table border ="1px" width ="500px" align =" center" id="tb1">
28             <thead>
29                 <tr>
30                     <th>编号</th>
31                     <th>姓名</th>
32                     <th>性别</th>
33                 </tr>
34             </thead>
35             <tbody>
36                 <tr>
37                     <td>1001</td>
38                     <td>张三</td>
39                     <td>男</td>
40                 </tr>
41                 <tr>
42                     <td>1002</td>
43                     <td>李四</td>
44                     <td>男</td>
45                 </tr>
46                 <tr>
47                     <td>1003</td>
48                     <td>王五</td>
49                     <td>男</td>
50                 </tr>
51                 <tr>
52                     <td>1004</td>
53                     <td>赵六</td>
54                     <td>女</td>
55                 </tr>
56                 <tr>
57                     <td>1005</td>
58                     <td>某七</td>
59                     <td>女</td>
60                 </tr>
61                 <tr>
62                     <td>1005</td>
63                     <td>某八</td>
64                     <td>男</td>
65                 </tr>
66             </tbody>
67         </table>
68     </body>
69 </html>

View Code