克隆每个元素后添加换行符

Question

$('.footnote').clone().appendTo('#allfootnotes').append('<br>');

我在整个页面中都有一堆.footnote元素，在页面底部，我想列出页面上的所有脚注。 因此，每个脚注将被克隆为#allfootnotes 。 我正在尝试在#allfootnotes元素中的每个.footnote之后放置一个换行符，因此它们不会混杂在一起。

一旦将每个.footnote克隆到#allfootnotes后，我将如何应用#allfootnotes ？

这是最好的方法吗？ 在每个.footnote有2个span标签，一个用于标题，一个用于脚注内容（不知道这是否重要）。

Answer 1

听起来您可以使用CSS来做到这一点

#allfootnotes .footnote {
  margin-bottom: 10px;      
}

根据您的情况，您可能需要将.footnote设置为带有display: block;的块级元素display: block;

Answer 2

演示

$('.footnote').clone().appendTo('#allfootnotes').after('<br>');

如果您使用的是XHTML，则应该<br />

Answer 3

var allFootNotes = $('#allfootnotes');
$('.footnote').each(function(){
     $(this).clone().add('<br/>').appendTo(allFootNotes);
});

如果$('#allfootnotes')与您说的一样多，则缓存$('#allfootnotes')将减少浏览器的负载。

希望这可以帮助

Answer 4

$('.footnote').each(function() {
    $(this).clone().add('<br/>').appendTo('#allfootnotes');
});

编辑请参阅roXon的答案。 比自己遍历脚注还干净。