使用jQuery更改flaticon的class和css

Question

这是情况

<div id="idDiv">
    <span class="flaticon-edit23"></span>
</div>

更改跨度的css我必须这样做

#idDiv > span::before{
    position: relative;
    font-size: 26px;
    line-height: 60px;
    margin-left: 13px;
    color: white;
}

如果我点击 #idDiv ，我必须更改范围的图标，还要更改css范围的一些参数（在这种情况下，字体大小）

这样可行，并正确更改图标

$("#idDiv").find("span:first").removeClass().addClass("flaticon-floppy13");

但是我应该改变:: before选择器的css，然后尝试这个（以及其他类似的组合）

$("#idDiv").find("span:first").removeClass().addClass("flaticon-floppy13").find("span:before").css({"font-size":"36px"});

但它无法正常工作

我该怎么做？感谢

更新

这不干了

$("#idDiv").find("span:first").removeClass().addClass("flaticon-floppy13");
$("#idDiv").find("span:before").css("font-size","36px");

这不干了

$("#idDiv").find("span:first").removeClass().addClass("flaticon-floppy13");
$("#idDiv").find("span:before").css({"font-size":"36px"});

这不干了

 .new_class{font-size: 36px; } 
 $("#idDiv").find("span:first").removeClass().addClass("flaticon-floppy13");
 $("#idDiv").find("span:first").addClass("new_class");

这不干了

 .new_class > span::before{font-size: 36px; } 
 $("#idDiv").find("span:first").removeClass().addClass("flaticon-floppy13");
 $("#idDiv").find("span:first").addClass("new_class");

Answer 1

我不认为可以选择和修改pseudo elements。

您可以做的是定义两个不同的伪元素，并根据span的CSS类应用其中任何一个。

e.g。

#idDiv > span.flaticon-edit23::before{
    position: relative;
    font-size: 26px;
    line-height: 60px;
    margin-left: 13px;
    color: white;
}

#idDiv > span.flaticon-floppy13::before{
    position: relative;
    font-size: 36px;
    line-height: 60px;
    margin-left: 13px;
    color: white;
}

然后，只更改范围的CSS类

$("#idDiv").find("span:first").removeClass().addClass("flaticon-floppy13");

应该足够了..

Answer 2

$("#idDiv").find("span:first").removeClass().addClass("flaticon-floppy13");
$("#idDiv").find("span:before").css("font-size":"36px");

另外

if (!$('.your class').val()) {
            $('#idDiv').val("flaticon-floppy13");
        } else {
            $('#idDiv').val("");
        }

或者只是删除{}但最好将功能分开。我不认为他们一起工作。

Answer 3

你这样做过吗？

 .new_class{font-size: 36px !important; } 

$("#idDiv").find("span:first").addClass("new_class");