css设置细边框+js控制表格隔行变色

样式如下（表头为灰色，表格内容颜色为白色和灰色隔行变色，鼠标滑过为深灰色，鼠标离开回复原本颜色）

<table id="tb1" cellpadding="5" height="20" cellspacing="0">
    <thead>
      <tr id="thColor">
        <td>证书类型</td>
      </tr>
    </thead>
    <tbody id="tb2">
      <tr>
        <td>回忆三部曲</td>
      </tr>
      <tr>
        <td>未麻的部屋</td>
      </tr>
      <tr>
        <td>千年女优</td>
      </tr>
      <tr>
        <td>妄想代理人</td>
      </tr>
      <tr>
        <td>红辣椒</td>
      </tr>
      <tr>
        <td>东京教父</td>
      </tr>
    </tbody>
  </table>

　　

 <style>
    #tb1 {
       475px;
      text-align: center;
      font-size: 14px;
      background-color: #ccc;
      border-spacing: 1px;
    }
    #thColor {
      background: rgb(245, 245, 245);
      font-weight: bold;
    }
  </style>

　　

<script>
    window.onload = function tablecolor() {
      var t_name = document.getElementById("tb2");
      var t_len = t_name.getElementsByTagName("tr");

      for (var i = 0; i <= t_len.length; i++) {
        //偶数行时执行
        if (i % 2 == 0) {
          t_len[i].style.backgroundColor = "rgb(255,255,255)"
          //添加鼠标经过事件
          t_len[i].onmouseover = function () {
            this.style.backgroundColor = "rgb(234, 234, 234)"
          }
          //添加鼠标离开事件
          t_len[i].onmouseout = function () {
            this.style.backgroundColor = "rgb(255,255,255)"
          }
        }
        else {
          t_len[i].style.backgroundColor = "rgb(245, 245, 245)";

          t_len[i].onmouseover = function () {
            this.style.backgroundColor = "rgb(234, 234, 234)"
          }
          t_len[i].onmouseout = function () {
            this.style.backgroundColor = "rgb(245, 245, 245)"
          }
        }
      }
    }
  </script>