JQuery中的addClass是否覆盖任何现有的基于css类的样式？

我正在尝试向单击的元素添加一个类。这些元素已经分配了多个类别，包括一个带有边框的类别

虽然我知道我可以使用removeClass（）删除当前的CSS类，但我需要该类提供的其他样式。因此，我想知道的是，下面的示例是否可以用addClass（）覆盖边框样式？是不是边框已经设置了属性？我不想使用内联样式，因为它们不容易维护

CSS:

无法工作的JQuery：

$(this).closest('.drop').addClass('dibHighlight'); // Doesn't work

工作正常的JQuery：

$(this).closest('.drop').css({ border: "1px solid orange" }); // Works

---

您可以根据的规则使用

addClass

覆盖其他类，就像CSS类在元素上使用

class

属性时覆盖/继承彼此的属性一样

第二个示例之所以有效，是因为它相当于在元素上设置

style

属性，根据CSS的特殊性，该属性几乎是最具体的

---

相反，第一个示例不起作用，因为可能有一个CSS类比

.dibHighlight

更具体，可能还有另一个类优先于CSS中其他地方定义的

dibHighlight

。您应该使用Firebug（或类似的开发工具）测试哪些样式/类应用于您的元素

或者，对于肮脏的快速修复，请尝试以下方法：

.dibHighlight{border:1px solid orange !important;}

---

下面的类不起作用，因为在css文件中有一些现有类的代码在这个类下面

.dibHighlight{border:1px solid orange;}

要使下面的代码正常工作，只需将上面的css代码粘贴到css文件的最后一行。

$(this).closest('.drop').addClass('dibHighlight');

完成此操作后，当您在jquery中使用addClass添加类时，它将覆盖现有的类相似属性

---

我建议使用

toggleClass（）

而不是

addClass（）

，因为即使

toggleClass（）

也可以用作

addClass（）

以防您要添加的类不存在。

必须有其他选择器覆盖您的

规则。很有趣，这仍然没有更新边框！我不想长期使用它作为解决方案，但令人惊讶的是它没有工作——因为它没有工作（更确切地说，因为它甚至是一个速记值），那么修改值的内容已经使用了
！重要信息
，该类的定义是否超出了文档的范围？（例如，检查css文件名的拼写：这很愚蠢，但经过数小时的编码后，可能会发生：））。在任何情况下，找出真正发生了什么的唯一可靠方法是选择Firebug（或类似）中的元素，并查看应用了哪些类以及哪些类覆盖了边框样式。+1表示提及Firebug。有时候这是唯一确定的找出CSS错误的方法。我用一个样式表来处理所有的事情，所以我肯定会包括正确的样式表。将firebug安装到它并再次查看+1用于切换类提示。虽然css在我的css文件的最后一行，问题仍然在发生…-1它与css文件中类定义的位置无关。@Optus恐怕你错了。我只是把它移到了最底层（之前是几行，忽略了另一个同样适用的定义），现在它可以工作了：）+1@optus：它肯定与类定义的位置有关。使用toggleClass时，如果类包含的属性也存在于已存在的类中，则在这种情况下，将优先选择最后一个类定义。你可以自己查一下，我收回。根据：
Finally，按指定的顺序排序：如果两个声明具有相同的权重、来源和特殊性，则后一个指定的声明获胜。
定义的顺序是最终/最小加权的优先级微分器。出于这个原因，我认为依赖CSS文件中顺序定义的优先级而不是特定性是不可取的。
$(this).closest('.drop').addClass('dibHighlight');