在jQuery中，我如何添加一些東西作爲兄弟？

Question

例如，假設我有

<div class="sibling1"></div> 
<div class="sibling3"></div> 

我如何可以插入

<div class="sibling2"></div> 

上面之間？我曾嘗試在前面加上但是這使得孩子沒有兄弟姐妹

Answer 1

在jQuery中，在特定位置插入內容有許多不同的選項。這在jQuery documentation page for DOM insertion outside an object中描述得相當好。

要插入一個現有的元件之外的內容（例如，不孩子），但是相對於該對象定位，必須在這個jQuery doc截圖示出了四個選項：

第一兩者之間的差而最後兩個是完全在哪個論點哪個。對於前兩個，插入位置在jQuery對象中，內容位於函數參數中。對於最後兩個，要插入的內容位於jQuery對象中，並且目標位於函數參數中。由於多個函數調用的鏈接，有時一個或另一個更方便。如你所見，這可以讓你在現有對象之前或之後插入內容（這將使它成爲該對象的同胞）。

如果你希望它是該對象的孩子，那麼你可以使用任何six jQuery methods，可以設置/更改內部內容包括.append()，.appendTo()，.html()等...

Answer 2

http://api.jquery.com/insertBefore/：

$('<div class="sibling2"></div>').insertBefore($('.sibling3')); 

Answer 3

使用after，就像這樣：

$('.sibling1').after('<div class="sibling2"></div>'); 

您還可以使用ID而不是類，感覺更對我來說就像這樣：

<div id="sibling1" class="sibling"></div> 
<div id="sibling3" class="sibling"></div> 

然後用：

$('#sibling1').after('<div id="sibling2" class="sibling"></div>');