使用jQuery將div中的所有鏈接添加到另一個div中

Question

我正在嘗試從div鏈接中獲取鏈接，並將其添加到div links2中，使div鏈接中的鏈接保持原樣，並且在div鏈接2中的鏈接在每個鏈接之后均帶有<br />

你在說什么！？！ 好的，讓我們看一下：

HTML：

<div id="links">
  <a href="#">one</a>
  <a href="#">two</a>
  <a href="#">three</a>
</div>
<div id="results"></div>
<div id="links2"></div>

JS：

var elements = $('#links a');
$('#results')
.text('there are ' + elements.length + ' links');
$('#links2').append(elements)

好的，所以忽略結果div，這只是顯示總共有多少個鏈接。

現在我有附加，這是完全從div鏈接中刪除鏈接。 我怎么做，所以它只是將鏈接添加到links2中，每個鏈接之間都帶有br。

因此，最終輸出將顯示以下內容：

<div id="links">
  <a href="#">one</a>
  <a href="#">two</a>
  <a href="#">three</a>
</div>
<div id="results">there are 3 links</div>
<div id="links2">
  <a href="#">one</a><br />
  <a href="#">two</a><br />
  <a href="#">three</a><br />
</div>

更新小提琴：（需要添加br仍然） http://jsfiddle.net/upLg4/44/

Answer 1

您必須.clone()附加到其他元素，

$('#links2').append(elements.clone())

DEMO

對象elements是在div#link引用一組錨標記，因此當遇到遇到引用其他元素/選擇器的對象時，append會將元素從一個位置轉移到另一個位置。 這就是為什么我們必須手動克隆它的原因。

Answer 2

使用after()方法在每個鏈接之后添加<br> ，如下所示。

 var elements = $('#links a'); $('#results').text('there are ' + elements.length + ' links'); $('#links2').append(elements.clone()); $('#links2 a').after('<br />'); // use this line to add <br> 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="links"> <a href="#">one</a> <a href="#">two</a> <a href="#">three</a> </div> <div id="results"></div> <div id="links2"></div>