删除元素时不要丢失变量数据

Don't lose variable data when removing element

本文关键字：变量 数据 元素 删除      更新时间：2023-09-26

如何将元素保存为变量，然后将其删除，但不丢失变量数据?

var elements = $('.element');
elements.remove();
elements.insertAfter('.insertAfterElement');

用.detach()代替.remove()

从文档:

.detach()方法与.remove()方法相同，除了.detach()保留所有与被删除元素相关的jQuery数据。当删除的元素稍后要重新插入到DOM中时，此方法非常有用。

从http://api.jquery.com/remove/:

除了元素本身，所有的绑定事件和jQuery与元素关联的数据将被删除。移除元素不删除数据和事件，使用.detach()代替。

从http://api.jquery.com/detach/

:

.detach()方法与.remove()相同，不同之处在于.detach()保留所有与被删除对象相关的jQuery数据元素。当要删除元素时，此方法非常有用

但是，当然，如果您要立即将它插入到文档中，那么使用它是没有意义的。

$('button').on('click', function() {
  $('.element').insertAfter('.insertAfterElement');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>Wrapper <span class="element">Element</span></div>
<button>Click me</button>
<div class="insertAfterElement"></div>

从http://api.jquery.com/remove/:

若要删除元素而不删除数据和事件，请使用.detach()。

用

var elements = $('.element');
elements.detach();
// later:
elements.insertAfter('.insertAfterElement');

但是，如果您只想立即移动元素，则根本不需要显式地从DOM中删除它们。只是将它们插入到不同的位置将隐式地将它们从原来的位置移除(而不是克隆它们)。所以只需使用

$('.element').insertAfter('.insertAfterElement');
相关文章：