Javascript OnClick更改各种元素链接颜色

我希望在单击其他链接时更改它们的链接。例如，如果用户单击A-Z，它将更改0-9的颜色

<a href="" id="list_users_title" onclick="document.getElementById('oneline a').style.color = '#414042'; document.getElementById('list_users_title a').style.color = '#B91200';">A-Z</a>
<a href="" id="oneline" onclick="document.getElementById('oneline a').style.color = '#B91200'; document.getElementById('list_users_title a').style.color = '#414042';">0-9</a>

我可以做它的颜色，但这覆盖了a：悬停，我仍然想使用

---

如果您使用

getElementById

时需要输入所需元素的id，我们将不胜感激。因此，请执行类似以下操作

document.getElementById（'oneline'）

而不是

document.getElementById（'oneline a'）

编辑

如果不想覆盖样式，请使用onclick事件向元素添加一个类（例如，“clicked by oneline”），而不是直接应用样式。然后使用样式表定义如下规则：

---

使用层叠来精确控制这些样式覆盖的交互方式。

您的问题是，在javascript的帮助下，您正在将内联css添加到

a

标记中。内联css的优先级高于

style

标记中的css

这里是解决办法-

<div id='style'></div>

<a href="" id="list_users_title" onclick="document.getElementById('style').innerHTML = '<style>ADD CSS HERE</style>';">A-Z</a>

---

这不会添加内联css

我如何设置a:link颜色而不是元素的颜色的样式？我可能会对元素应用一个类，然后使用css来控制样式，而不是直接应用样式。此外，您的

a

标记已经有了“oneline”id，因此

document.getElementById（'oneline'））

已经提到了锚。您好，像文档一样操作。getElementById（'oneline'）设置元素颜色并使a:hover a:visited无效这是正确的行为，给定您的代码，这就是我建议使用类和CSS的原因。

<div id='style'></div>

<a href="" id="list_users_title" onclick="document.getElementById('style').innerHTML = '<style>ADD CSS HERE</style>';">A-Z</a>