jquery - 来自 CSS 文件的样式覆盖了页面中应用的样式

Question

我正在使用 jQuery 添加一个 css 类

//Set the css class for tabItem's link
$("#" + menuID + " a").removeClass('navLinkNormal');
$("#" + menuID + " a").addClass('navLinkSelected');

但是 colr 值被不同 css 文件中的 a:link 和 a:visted 样式所取代。因此，它显示的不是红色，而是文本的黑色。

我尝试了各种方法，但没有奏效。我们如何强制使用红色链接？

引用资料:

1. > How to remove a <style> element with jquery?
2. > Is it possible to remove inline styles with jQuery?
3. > Styling a:visited links

HTML

   <ul id="nav">
        <li id="nav_Container" class="tabItem"><a href="javascript:void(0);">Add By Container</a></li>
        <li id="nav_WorkLot" class="tabItem"><a href="javascript:void(0);">Add By Worklot</a></li>
        <li id="nav_VisualAid" class="tabItem"><a href="javascript:void(0);">Add By Visual Aid</a></li>
    </ul>

风格

Answer 1

这是 specificity 的问题.由于其他样式“更具体地”针对该元素，您的类被覆盖；换句话说:

If two selectors apply to the same element, the one with higher specificity wins.

解决方案就像定位 <a> 一样简单类 navLinkSelected 的元素:

a.navLinkSelected { ... }