JavaScript实现表格行悬停或点击变色效果

JavaScript实现表格行悬停或点击变色效果

在HTML页面的表格（table）或div结构中，通常以行形式展示数据。为了增强交互性，可以设置当鼠标悬停或点击某一行时，动态改变该行的背景颜色。以下是部分实现代码。

<script type="text/javascript">
var currentActiveRow; //当前活动行
//改变选中行的颜色
function changeActiveRow(obj) {
 if (currentActiveRow) {
 currentActiveRow.style.backgroundColor = "";
 }
 currentActiveRow = obj;
 currentActiveRow.style.backgroundColor = "#F2F2F2";
}
</script>

HTML事件绑定方法

随后，在表格的单元格（td）上绑定onmouseover或onclick事件，例如通过onmouseover="changeActiveRow(this)"来触发上述函数。