jQuery在克隆上更改html

Question

点击我复制一个div.我想改变一些HTML然后追加.

我尝试了以下,它将克隆和追加但我似乎无法改变HTML.不知道处理它的最佳方法是什么,我确信我错了.

谢谢

var htmlStr = $(this).parents(".listingContainer").first();
$htmlStr.find(".saveCompareShow").remove()
$(htmlStr).clone().appendTo('.compareWrapper');                         

Answer 1

克隆DOM元素后,您应该将其视为您想要更改未克隆的DOM元素.您只需使用变量而不是选择器.

假设您有这样的HTML:

?<div class='listingContainer'>
    <div class='listing'>
        Something
    </div>
    <div class='listing'>
        Another something
    </div>
</div>

您可以克隆listingContainer DIV的内容并更改内容,然后将它们附加到compareWrapper div.以下JavaScript显示了一个简单示例:

$(document).ready(function() {
    $('.listing').click(function() {
        var $htmlStr = $(this).parents(".listingContainer").first();
        $htmlStr.clone().find('.listing').html('<li>Cloned</li>').appendTo('.compareWrapper');
    });
});

我还发布了一个jsFiddle,所以你可以看到它工作:http://jsfiddle.net/hkBMK/