将 div 中的所有链接添加到另一个 div 并使用 jquery 中断

Question

我正在尝试从 div links 中取出 links 并将它们添加到 div links2 保持 links in div links 和 div links2 中的 links 在每个 [= 之后有一个 <br /> 42=]

你在说什么！？！好的，让我们看看：

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，这只是显示总共有多少 link。

现在我有追加，它完全删除了 div link 中的 link。我怎样才能做到它只是将 links 添加到 links2 并在每个 link.

之间添加一个 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>

已更新fiddle:(仍需添加br） http://jsfiddle.net/upLg4/44/

Answer 1

您必须 .clone() 它才能附加到其他元素，

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

DEMO

对象 elements 引用了 div#link 中的一组锚标记，因此当遇到引用其他 elements/a 的对象时，通常追加会将元素从一个地方移动到另一个地方选择器。这就是我们必须手动克隆它的原因。

Answer 2

使用after()方法在每个link之后添加<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>

将 div 中的所有链接添加到另一个 div 并使用 jquery 中断

add all links in div to another div with break using jquery

html

javascript

jquery

element

add

DEMO