js隔行换色可重复点击

如果您想要实现隔行换色的同时还能够重复点击按钮，可以使用以下代码：

HTML代码：

<table id="myTable">
  <tr>
    <td>Row 1, Column 1</td>
    <td>Row 1, Column 2</td>
  </tr>
  <tr>
    <td>Row 2, Column 1</td>
    <td>Row 2, Column 2</td>
  </tr>
  <tr>
    <td>Row 3, Column 1</td>
    <td>Row 3, Column 2</td>
  </tr>
</table>
<button onclick="toggleColor()">Toggle Color</button>

JS代码：

function toggleColor() {
  var table = document.getElementById("myTable");
  var rows = table.rows;
  for (var i = 0; i < rows.length; i++) {
    if (i % 2 == 0) {
      rows[i].classList.toggle("even-row");
    }
  }
}

CSS代码：

.even-row {
  background-color: #f2f2f2;
}

以上代码实现了一个隔行换色的效果，每次点击按钮都会切换表格的背景色。CSS部分定义了一个名为“even-row”的类，用于设置偶数行的背景色。JS部分使用了“classList.toggle()”方法来切换该类的开启与关闭。这样做可以保证每次点击按钮都能够重复隔行换色，而不会出现背景色重叠的问题。