jQuery将CSS类更改为di

例如,如果我有一个div元素,并且使用许多CSS属性定义了“ first”类。 我是否可以将css类“ second”分配给同样的div,而仅在某个事件中,该类也具有许多不同的属性,而无需在一行中写入每个属性。

eomeroff asked 2020-02-20T11:38:29Z
6个解决方案
89 votes

是的,轻松。

$("#mydiv").attr("class", "second");
womp answered 2020-02-20T11:39:03Z
59 votes
$(".first").addClass("second");

如果您想将其添加到事件中,也可以轻松地添加。 点击事件的示例:

$(".first").click(function() {
    $(this).addClass("second");
});
Mark Hurd answered 2020-02-20T11:38:43Z
30 votes

您可以使用jQuery添加和删除类,如下所示:

$(".first").addClass("second")
// remove a class
$(".first").removeClass("second")

顺便说一下,您可以立即在标记中设置多个类,并用空格隔开

<div class="second first"></div>
Daff answered 2020-02-20T11:39:28Z
3 votes

这可能未完全达到目标,因为我不确定您要做什么。 但是,假设您要为事件分配一个不同的类给div,答案是肯定的,您当然可以使用jQuery来做到这一点。 我只是一个jQuery初学者,但是我在代码中使用了以下内容:

$(document).ready(function() {
    $("#someElementID").click(function() {  // this is your event
        $("#divID").addClass("second");     // here your adding the new class
    )}; 
)};

如果您想用第二个类替换第一个类,我相信您将像上面一样先使用removeClass然后再使用addClass。 toggleClass也可能值得一看。 jQuery文档针对这些类型的更改编写了很好的示例。

我的其他人有更好的选择,但我希望能有所帮助!

Carvell Fenton answered 2020-02-20T11:39:58Z
2 votes

像div这样的HTML元素可以具有多个类。 假设div使用addClass方法分配了两种样式。 如果style1具有3个属性,如字体大小,粗细和颜色,而style2具有4种属性,如字体大小,粗细,颜色和背景颜色,那么我认为所得的有效属性集(样式)将具有4个属性,即联合 所有样式集。 在我们的示例中,颜色,字体大小,重量等常见属性将具有一种最新值。 如果首先为div分配了style1,然后为其分配了style2,则通用属性将被style2值覆盖。

此外,我在“使用JQuery来应用,删除和管理样式”上写了一篇文章,希望对您有所帮助。

问候阿怀斯

Awais answered 2020-02-20T11:40:28Z
0 votes
$(document).ready(function () {

            $("#divId").toggleClass('cssclassname'); // toggle class
});

**OR**

$(document).ready(function() {
        $("#objectId").click(function() {  // click or other event to change the div class
                $("#divId").toggleClass("cssclassname");     // toggle class
        )}; 
)};
Virang Maniar answered 2020-02-20T11:40:43Z
translate from https://stackoverflow.com:/questions/1835440/jquery-changing-css-class-to-div