当子元素悬停时，我如何选择父元素？

Question

当子元素悬停时，我将如何选择父元素？

例如：

<table id="tb1">
<tr>
<td id="td1">make table red</td>
<td id="td2">make table yellow</td>
</tr>
</table>

有没有办法在td1使用id或class标签悬停时选择tb1？

Answer 1

不幸的是，当使用CSS悬停子元素时，无法选择父元素。 这将违反级联样式表中的级联。 但是，您可以使用JavaScript或其中一个库（如jQuery）轻松完成此操作。

如果您使用jQuery，以下将提供您正在寻找的结果：

http://jsfiddle.net/fSqSx/

Answer 2

表格和TD的ID总是这样命名吗？ 假设将鼠标悬停在TD上会产生一个具有您可以执行的功能的事件

function highlightTable(){
  var tableID=this.id.replace('td','tb');
  document.getElementById(tableID).style.backgroundColor='#c0c0c0';
}