jquery

Question

我很难理解为什么不能多次附加 jQuery 对象：

var $divObj = $('<div/>', { 'text': 'This is a div!' });

$('button').on('click', function() {
  $('#example').append($divObj);
});

<div id="example"></div>
<button>Add Div</button>

这仅在第一次button单击时有效。随后的点击似乎没有做任何事情。

我知道我可以clone()在附加对象时使用，或者可以将其div作为字符串传递，但我正在寻找关于为什么附加对象不能多次工作的解释。

score 7 · Accepted Answer

因为$divObj持有对 DOM 元素的引用（嗯，一个 jQuery 对象，但它只是包装了 DOM 元素）。当您将该元素附加到 DOM 时，$divObj仍然引用同一个对象。当您将其插入 DOM 时，它不会神奇地复制它。

如您所说，您可以使用它.clone()来创建节点的新副本，该副本可以自行再次附加。

score 0 · Accepted Answer

问题是，在页面完全加载后，它没有从 $divObj 中获取值。
如果您想在每次单击时显示消息，您可以做的是将 $divObj 放入单击功能中，它会起作用。
这是代码更改。

$('button').on('click', function() {
    var $divObj = $('<div />', { 'text': 'This is a div!' });
    $('#example').append($divObj);
});

谢谢

jquery - 为什么不能多次附加 jQuery 对象？