修改jquery脚本以在appendTo（）函数中使用this.parent

Question

我正在使用此jquery脚本复制<div>中第一个元素scoll-box的元素：

$(".scroll-box > *").first().clone().appendTo(".scroll-box");

我想重写脚本的appendTo()部分以使用$(this).parent规范，以便脚本可以在.scroll-box元素的多个实例上运行。我该怎么做？

原始HTML如下所示：

<div id="scroll-box" class="scroll-box">
    <div>Line 1</div>
    <div>Line 2</div>
    <div>Line 3</div>
</div>

Answer 1

要每次引用不同的元素，最好的办法是.each，其中this每次都是一组元素：

// for each .scroll-box
$(".scroll-box").each(function() {
    // clone first child and append to this .scoll-box
    $(this).children().first().clone().appendTo(this);
});

这种方式不需要{p> .parent()，因为this指的是.scoll-box元素。

Answer 2

$(".scroll-box > *").each(function() {
    $(this).clone().appendTo($(this).parent());
});

Answer 3

缓存选择器并使用.parent()方法。

var el = $(".scroll-box > *");
var clone = el.first().clone();
el.parent().append(clone);