javascript - 如何在 HTML + CSS 中通过另一个元素选择器更改一个元素的属性值？

Question

我有 2 个元素按钮，我想在单击另一个时更改其中一个的颜色，反之亦然。我试过了，但没有用。谁能帮我？HTML:

<button id="t1">Test 1</button>
<button id="t2">Test 2</button>

CSS:

#t1:active + #t2
{
    color: red;
}
#t2:active + #t1
{
    color: red;
}

Answer 1

我可以想到几种仅使用 CSS 来实现此目的的方法，尽管它们并不完全“真诚”。

第一种方法依赖于创建第一个按钮的“假”克隆，并在第二个按钮为:active 时显示它，演示:little link .

第二种方法依赖于这样一个事实，即当您的一个 button 是 :active 时，它后面的父元素是 :active以及。这是此解决方案的演示:little link .