如果在循环中更改DOM，则jQuery each（）行为

Question

使用each（）循环时jquery的行为是什么？是吗：

1. 寻找第一个对象，执行函数，寻找下一个对象......
2. 收集容器中的所有对象，然后对每个对象执行该功能
3. 其他（究竟是什么？）

一个相关的例子：

<div id="a">
   A
   <div id="b">
      B
   </div>
</div>
<div id="c">
    C
</div>

如果我执行此javascript：

$('div').each(function(index){
   alert($(this).html());
   $(this).remove();
}

我会看到三个警报还是只有两个？

Answer 1

无论您对选择执行什么操作， jQuery都会在应用该操作之前进行选择。我的意思是$('div')是一个选择器，选择过程发生在之前，不管其他链式方法（例如each()）。这是该语言的产物，因为必须先评估$()才能调用方法。

如果该选择从您的页面中抓取了三个div，那么现在列表中有3个jQuery对象可以迭代。 您可以通过：

来证明这一点

$('div').length

因此，您正在迭代具有三个索引（0,1,2）的数组，如果从索引1的DOM中删除div，则each()回调的下一次迭代仍将是该对象索引2.查看此实时演示以获取证据：

DEMO： http://jsfiddle.net/marcuswhybrow/HYJa4/

Answer 2

jQuery的行为与你在＃2中描述的一样。你会看到三个警报：

1. “A＆lt; div＆gt; B＆lt; / div＆gt;”
2. “B”
3. “C”

但是，由于div B在div A中，它将被div A删除.jQuery仍然知道它，并将提醒其内容，但它将在那时被删除。因此，虽然您收到三个警报，但只有两个删除（因为它会删除子元素）。

Answer 3

2就是答案。

jQuery收集匹配元素的列表，然后遍历列表。

但有一点重要的想法是，不要删除任何尚未处理的可以匹配的元素，否则您将面临未找到引用错误的风险。