,可以通过以下步骤实现:
<table>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td class="last-cell">Cell 3</td>
</tr>
<tr>
<td>Cell 4</td>
<td>Cell 5</td>
<td class="last-cell">Cell 6</td>
</tr>
<!-- More rows... -->
</table>
// 获取所有包含最后一个单元格的行
const rows = document.querySelectorAll('tr');
// 遍历每一行
rows.forEach(row => {
// 监听鼠标悬停事件
row.addEventListener('mouseover', () => {
// 获取当前行的最后一个单元格
const lastCell = row.querySelector('.last-cell');
// 更改最后一个单元格的背景颜色
lastCell.style.backgroundColor = 'red';
});
// 监听鼠标离开事件
row.addEventListener('mouseout', () => {
// 获取当前行的最后一个单元格
const lastCell = row.querySelector('.last-cell');
// 恢复最后一个单元格的背景颜色
lastCell.style.backgroundColor = '';
});
});
推荐的腾讯云相关产品和产品介绍链接地址:
请注意,以上推荐的腾讯云产品仅供参考,具体选择应根据实际需求和情况进行决策。
领取专属 10元无门槛券
手把手带您无忧上云