javascript - 使用 JS 进行样式设置时，CSS 优先级

Question

这个问题是关于优先级的。我有一个<ul>包含我的导航项目的<li>我有一个 id 用于<ul>引用嵌套在其中的<li>和标签以进行样式设置。<a>这一切都很好，但是当我使用 JavaScript 向这些特定<a>标签添加一个类时，在将鼠标悬停在链接上时改变外观没有任何反应。

我知道代码是正确的，因为我已经对其进行了测试，但是在引用样式时，ID 样式似乎优先于 Class 样式。

我将如何寻找解决方案，我的一个想法是在添加类之前删除 mouseenter 上的现有 ID，然后在 mouseleave 上反之亦然。有更简单的解决方案吗？

score 2 · Accepted Answer

ID 样式更强大，但您也可以在添加样式链接的类时使用它。

所以，如果你的菜单是

<ul id="main">
    <li><a href=#></a></li>
</ul>

并且 JS 将类“悬停”添加到元素，然后使用 CSS

#main .hovered {
.. styles here
}

score -1 · Accepted Answer

尝试将 !important 添加到需要覆盖的值的 CSS 末尾。

.class { color: #fbfbfb !important; }

2 回答 2