简述jQuery 里的 each() 是什么函数？

八股文_JQuery面试题 0 28

each()是jQuery中的一个迭代函数，用于遍历一个jQuery对象集合中的所有元素，并对每个元素执行相同的回调函数。它常用于遍历DOM元素、数组或对象，并执行特定操作。

基本语法：

$(selector).each(function(index, element) {
    // 对每个元素执行的操作
});

作用和用途：
each()函数用于循环遍历集合中的每个元素，并为每个元素执行指定的回调函数。在处理多个DOM元素时，each()非常有用。例如，遍历所有的列表项并对其进行操作。

示例：
```
$("li").each(function(index, element) {
   console.log("第 " + (index + 1) + " 个列表项: " + $(element).text());
});
```
这段代码会遍历所有的<li>元素，输出每个列表项的文本内容及其在集合中的位置。
如何与DOM元素交互：
在each()的回调函数中，this指向的是当前遍历的DOM元素，你可以使用$(this)将其转换为jQuery对象，然后进行操作。例如，修改每个元素的样式或属性：
```
$("div").each(function() {
   $(this).css("color", "red");  // 修改每个div的文字颜色
});
```

与数组或对象的结合使用：
each()不仅可以遍历DOM元素，还可以用于遍历数组或对象。在处理数组时，each()可以通过索引访问每个元素：

var arr = [1, 2, 3, 4];
$.each(arr, function(index, value) {
   console.log("索引: " + index + ", 值: " + value);
});

对象的遍历也非常方便：

var obj = { name: "Alice", age: 25 };
$.each(obj, function(key, value) {
   console.log("键: " + key + ", 值: " + value);
});

返回值：
each()函数本身并不返回任何值，而是直接在回调函数中执行操作。回调函数的返回值可以影响迭代过程。如果回调函数返回false，则会停止遍历；返回true或不返回值时，会继续遍历。

示例：
```
$("li").each(function(index, element) {
   if (index === 2) {
       return false;  // 停止遍历
   }
   console.log($(element).text());
});
```
性能注意事项：
- each()适用于大多数需要遍历集合的场景，但如果只需操作一次的元素或非常大的DOM集合时，使用原生JavaScript的for循环可能会有更好的性能。
- 在数组或对象的情况下，$.each()（而非$(selector).each()）也通常表现更好。

each()是jQuery中非常有用的一个函数，适用于遍历集合中的DOM元素、数组或对象，并执行特定的回调操作。它提供了简单的迭代机制，使得批量操作DOM元素变得高效和简洁。