JavaScript实现表格动态变色

JavaScript实现表格动态变色的方法如下所示：

1. 使用CSS选取器选择表格需要变色的行或单元格
   可以使用CSS的nth-child()伪类选择器，它可以选择表格中的每个行或单元格，然后使用JavaScript改变它的样式。示例代码如下：

css
/* 隔行变色，红色和蓝色交替 */
tr:nth-child(odd) {
background-color: red;
}
tr:nth-child(even) {
background-color: blue;
}
/* 鼠标悬停时高亮当前行 */
tr:hover {
background-color: yellow;
}

1. 使用JavaScript遍历表格并改变样式
   如果需要更精细的控制，可以使用JavaScript遍历表格中的每个行或单元格，并为其设置不同的样式。示例代码如下：

javascript
// 获取表格
var table = document.getElementById("myTable");
// 遍历每个行
for (var i = 0; i < table.rows.length; i++) {
var row = table.rows[i];
// 隔行变色
if (i % 2 == 0) {
row.style.backgroundColor = "red";
} else {
row.style.backgroundColor = "blue";
}
// 当前行鼠标悬停时高亮
row.onmouseover = function() {
this.style.backgroundColor = "yellow";
}
row.onmouseout = function() {
// 恢复隔行变色
if (i % 2 == 0) {
this.style.backgroundColor = "red";
} else {
this.style.backgroundColor = "blue";
}
}
}

以上示例代码演示了如何实现表格的隔行变色和鼠标悬停高亮。可以根据需要自定义样式。