JQuery中$.each 和$(selector).each()的区别详解

深入理解jQuery中的`$.each()`与`$(selector).each()`：区别详解

在jQuery中，遍历是一个常见的操作，其中`$.each()`和`$(selector).each()`是两个常用的遍历方法。它们虽然都用于遍历，但有着明显的区别。本文将详细解读它们之间的不同之处。

我们先了解一下`$.each()`方法。这是一个非常通用的遍历函数，可以用于遍历对象和数组。无论是数组还是具有length属性的伪数组对象（如函数的arguments对象），`$.each()`都能轻松应对。它按照数字索引进行遍历，从0到length-1。在遍历数组时，回调函数中每次都会传入数组的索引和对应的值。值得注意的是，虽然可以使用`this`关键字获取值，但JavaScript会将`this`值包装为一个对象，即使它是一个字符串或数字。`$.each()`方法会返回被遍历对象的第一参数。

而`$(selector).each()`则是专门用于遍历jQuery对象的。当你需要对选定的DOM元素进行操作时，这个方法非常有用。与`$.each()`不同，`$(selector).each()`只能用于jQuery对象，不能用于普通对象和数组的遍历。在遍历过程中，它同样会按照索引（或属性名）进行遍历，但在回调函数中，可以直接使用`this`关键字引用当前迭代的元素。这是一个在DOM操作场景中非常实用的特性。

为了更好地理解这两个方法之间的区别，让我们看一些例子。假设我们有一个数组，我们想遍历并处理每个元素，我们可以使用`$.each()`方法。如果我们想选择一组DOM元素并对它们进行某种操作，那么我们应该使用`$(selector).each()`方法。

示例一：数组的遍历

想象一下这样一个场景，你手中有一个包含数字的小巧的数组，你希望通过jQuery的`each`函数来遍历它。代码是这样的：

```html

```

这段代码的输出会是：

```

序号：0，值：52

序号：1，值：97

```

每次迭代时，`each`函数都会传入数组的当前索引和对应的值。你可以想象这是一个小小的乐队指挥棒，指挥着每一个数字跃然而出。这就是数组遍历的魔力所在！