jQuery中的append()和appendTo()方法的效果不是简单的“插入”元素到指定位置,实际上是“移动”元素到指定位置。
参考jQuery API中的例子,可以发现:
<span>I have nothing more to say... </span>
<div id="foo">FOO! </div>
<script>
$( "span" ).appendTo( "#foo" );
</script>
上面代码的效果是将元素span移动到foo中,或者说是删除了原来的span元素,在foo中插入了相同的元素。
所以如果想要实现的是复制并插入的效果,应该先用clone()方法复制出一个新元素,然后再插入,如下面的例子:
<span>I have nothing more to say... </span>
<div id="foo">FOO! </div>
<script>
$( "span" ).clone().appendTo( "#foo" );
</script>