如何向现有类添加属性

Question

我有一个像这样的CSS类：

.simpleClass {
    width: 25px;
}

我有一个匹配元素：

<div class="simpleClass"></div>

我可以通过jQuery动态地将属性display: none;添加到CSS类.simpleClass吗？感谢。

Answer 1

您可以使用.css之类的

来指定元素的样式

$("div.simpleClass").css("width","25px");

查看jQuery.css()

Answer 2

如果我做对了，你不想给simpleClass的实例元素赋予属性，但是想要使用JS为整个类（覆盖所有实例）提供额外的属性。

在这种情况下，您可以使用jQuery将样式元素追加到头部，让您有机会添加其他CSS声明。

但是，我会不推荐这个，因为它会导致您的代码和结构变得混乱。

$("head").append("<style> .simpleClass{ display:none; } </style>");

此代码段会为执行此操作时存在的所有display:none元素提供额外的.simpleClass属性，并且还会影响每个后来插入的.simpleClass元素。

Answer 3

$('.simpleClass').css({display:'none'});

Answer 4

如果css类中已经不存在该属性，则该属性将被添加到div中。因此，使用新属性切换css类总是更好。例如

$( ".referenceClass" ).switchClass( "oldClass", "newClass");

Answer 5

样式表在文件中定义，您无法使用JavaScript编辑它。你能做的是：

$(".simpleClass").live("domchanged", function() {
    $(this).css("display", "none");
});

但这既不是不是跨浏览器兼容也不是效率（也不是我测试过的）。所以我建议为此目的使用另一个预定义的CSS类。 你为什么还需要这样的东西？

Answer 6

$(document).ready(function(){
    $(.simpleClass).css('display','none');
});