Question

我的jQuery代码带来了新的文本和新的样式。当我更新样式，然后带来新文本时，新样式就会消失。我期待新款式坚持下去。这样做了吗？下面是一个例子。

$( document ).ready(function() {

    $('.column').addClass('color2') ;

    $('#text').html("<div class='column'>Text22</div>");

    //$('.column').addClass('color2') ;


});

Answer 1

这是因为您的订单有误，您正在添加一个类，然后将该元素替换为没有该类的元素，您应该这样做：

$( document ).ready(function() {    
    $('#text').html("<div class='column'>Text22</div>");
    $('.column').addClass('color2') ;    

});

或者，您可以这样做：

$('#text').html("<div class='column color2'>Text22</div>");

确保元素在添加时具有所需的类。

Answer 2

您需要交换代码的顺序：

$(document).ready(function () {
    $('#text').html("<div class='column'>Text22</div>");
    $('.column').addClass('color2');
});

您的代码无效，因为您将color2类添加到.column div，但DOM中尚不存在.column。因此，您需要首先将其添加到DOM中，这是在您将.column设置为#test div的内部HTML之后出现的。

<强> Updated Fiddle

jQuery和CSS - 修改文本并重新设置它

2 个答案: