修改jQuery腳本使用this.parent在appendTo（）函數

Question

我使用這個jQuery腳本scoll-box類複製<div>裏面的第一個元素：

$(".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); 
}); 

.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);