当您在每个循环中修改 jQuery 集合时，是包含修改后的集合还是仅包含原始集合？答案

【问题标题】：When you modify a jQuery collection within an each loop, is the modified collection included or just the original?当您在每个循环中修改 jQuery 集合时，是包含修改后的集合还是仅包含原始集合？
【发布时间】：2020-09-13 04:35:02
【问题描述】：

当您在 each 循环中修改 jQuery 集合时，是包含修改后的集合还是仅包含原始集合？

例如

var collection = $("div");
$(collection).each(function(){
    var originalDiv = $(this);
    var cloneDiv = $(this).clone();
    cloneDiv.insertAfter(originalDiv);
});

现在是克隆 div 包含在循环中还是只是原始集合？

【问题讨论】：

上面$(collection) 中的$() 没有任何理由。 collection 已经是一个 jQuery 对象。
是的，你甚至可以做到$("div").each(function() {
"当您在 each 循环中修改 jQuery 集合时" - 您没有修改集合
它实际上只是我快速编写的一些示例代码来解决这个问题，但感谢您的建议

标签： jquery clone each insertafter

【解决方案1】：

collection 中的 jQuery 对象不受您在循环中执行的 clone 和 insertAfter 调用的影响。 jQuery 对象是快照（就像您从 querySelectorAll 获得的那些），而不是实时集合（像您从 getElementsByTagName 或 getElementsByClassName 或类似获得的那些），clone 和 insertAfter 都不会将其添加到 @ 987654329@.

您可以轻松地向自己证明这一点：

// Your code (without the unnecessary `$()` around `collection`
var collection = $("div");
collection.each(function(){
    var originalDiv = $(this);
    var cloneDiv = $(this).clone();
    cloneDiv.insertAfter(originalDiv);
});

// Now, do another operation on the contents of `collection` -- notice how only
// the original contents are affected, not the divs created during the loop
collection.css("color", "blue");

<div>a</div>
<div>b</div>
<div>c</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

即使您使用其中一种方法将元素添加到 jQuery 对象，一般来说，jQuery 方法也会创建新的 jQuery 对象，而不是修改您调用它们的 jQuery 对象的状态。（我认为该规则有例外，但不会立即想到一个。）例如，您可以通过调用 add“添加”一个元素，但它不会更改您调用它的 jQuery 对象;相反，它创建并返回一个 new jQuery 对象，其中包含原始元素和新元素。

【讨论】：