利用js制作表格隔行变色

表格隔行变色

       <!-- 表格的隔行变色 -->        
<table  border="1"cellspacing="0" cellpadding="0">
    <thead>
    <tr>
      <th>姓名</th>
      <th>年龄</th>
      <th>性别</th>
      <th>电话</th>
    </tr>
</thead>
<tbody  id="tab">
    <tr>
      <td>张三</td>
      <td>23</td>
      <td>男</td>
      <td>110</td>
    </tr>
    <tr>
        <td>张三</td>
        <td>34</td>
        <td>男</td>
        <td>114</td>
    </tr>
    <tr>
        <td>张三</td>
        <td>28</td>
        <td>男</td>
        <td>120</td>
    </tr>
    <tr>
        <td>张三</td>
        <td>23</td>
        <td>男</td>
        <td>110</td>
      </tr>
      <tr>
          <td>张三</td>
          <td>34</td>
          <td>男</td>
          <td>114</td>
      </tr>
      <tr>
          <td>张三</td>
          <td>28</td>
          <td>男</td>
          <td>120</td>
      </tr>
      <tr>
        <td>张三</td>
        <td>23</td>
        <td>男</td>
        <td>110</td>
      </tr>
      <tr>
          <td>张三</td>
          <td>34</td>
          <td>男</td>
          <td>114</td>
      </tr>
      <tr>
          <td>张三</td>
          <td>28</td>
          <td>男</td>
          <td>120</td>
      </tr>
</tbody>
  </table>
    </body>
    <script>

        var otab=document.getElementById("tab")
        console.log(otab.children.length)
        for(var i=0;i<otab.children.length;i++){
        if(i%2==0){
            otab.children[i].style.background="yellowgreen"
        }else{
        otab.children[i].style.background="tomato"
        }
    }
</script>