有人可以解释为什么以下代码段不添加< foo>到#a和#b？
HTML：
<div id="a"></div> <div id="b"></div>
JS：
$(function(){
var $foo = $("<foo>HI</foo>");
$("#a").append($foo);
$("#b").append($foo);
});
编辑：感谢有用的点,事实上.append()移动元素解释这个行为.因为我的应用程序中的元素实际上是一个Backbone View的.el,我不喜欢克隆它.
解决方法
因为使用追加实际上移动元素.所以你的代码将$foo移动到#a的文档中,然后将其从#a移动到#b.你可以克隆它,而不是这样你想要的影响 – 这样它是附加一个克隆,而不是初始元素：
$(function(){
var $foo = $("<foo>HI</foo>");
$("#a").append($foo.clone());
$("#b").append($foo.clone());
});
你也可以从$foo追加html,而这只是把它放在dom中,而不是元素本身：
$(function(){
var $foo = $("<foo>HI</foo>");
$("#a").append($foo[0].outerHTML);
$("#b").append($foo[0].outerHTML);
});
