html - 当内部元素处于焦点时更改 <tr> 的颜色

Question

我想在用户选择其中的文本框时更改 tr 元素的颜色。焦点伪类不适用于它。 这可以不用 JavaScript 实现吗？

html:

<table>
<tr>
    <td>Name</td><td><input type="text" name="name"></td>
</tr>
</table>​

CSS:

tr:focus
{
    background:yellow;
}​

更新1:
看起来没有 CSS only 方法。使用 JavaScript 执行此操作的最简单方法是什么？

Answer 1

如何使用 :focus-within...

<table>
  <tr>
    <td>Name</td>
    <td><input type="text" name="name"></td>
  </tr>
</table>​

CSS:

tr:focus-within {
  background:yellow;
  }​

Fiddle

What helped me.因为选择的答案对我不起作用。