在另一個div內附加一個HTML div

Question

我想在一個div組中添加另一個div在點擊按鈕上，以便連續生成滑塊。像這樣：

<div class="carousel-items"> 
    <div class="date-carousel-other slider"></div> 
    <div class="date-carousel-other slider"></div> 
    <div class="date-carousel-other slider"></div><!-- new div --> 
</div> 

目前我的Java腳本是：

$('.slick-next').click(function(){ 
    $('"<div class="date-carousel-other slider"></div>"').append(".carousel-items"); 
}); 

結果被追加的箱子我滑塊下（大格），而不是滑塊內。如果添加".slider"，則會複製滑塊內的所有div和wedge框。

是我的語法關閉還是我使用錯誤的方法？

Answer 1

作爲每文檔，

的.append（）和.appendTo（）方法執行相同的任務。主要區別在於語法 - 特別是內容和目標的放置。使用.append（），該方法之前的選擇器表達式是插入內容的容器。另一方面，使用.appendTo（），內容在方法之前，或者作爲選擇器表達式，或者作爲即時創建的標記，並插入到目標容器中。

因此，您的解決方案失敗，因爲.append()期望目標作爲選擇器和內容作爲方法.append()中的參數。與此類似，

$('.slick-next').click(function(){ 
    $(".carousel-items").append('<div class="date-carousel-other slider"></div>'); 
}); 

如果你想保持目標和同樣內容

，使用.appendTo()代替.append()：

$('.slick-next').click(function(){ 
$('<div class="date-carousel-other slider"></div>').appendTo(".carousel-items"); 
}); 

Answer 2

您需要使用appendTo()，而不是append()，也刪除不必要的報價""

$('<div class="date-carousel-other slider"></div>').appendTo(".carousel-items"); 

Answer 3

試着用追加（）

$('.carousel-items').append("<div class='date-carousel-other slider'></div>"); 

或使用.appendTo（）

$('<div class="date-carousel-other slider"></div>').appendTo(".carousel-items"); 

Answer 4

你交換 「選擇」 和 「內容」 的位置。在所選擇的元件的端部指定的內容

$('.slick-next').click(function(){ 
    $(".carousel-items").append('"<div class="date-carousel-other slider"></div>"'); 
}); 

的append（）方法插入：必須使用append()像的下方。

語法：

$(selector).append(content,function(index,html)) 

Answer 5

你換吧 -

$(".carousel-items").append("<div class='date-carousel-other slider'></div>"); 

或者使用appendTo -

$("<div class='date-carousel-other slider'></div>").appendTo(".carousel-items");