深入理解$.each和$(selector).each

深入理解$.each和$(selector).each

在jQuery中，$.each和$(selector).each这两个方法是用来遍历集合元素的，其功能和JavaScript本身提供的遍历方式有些不同。在这篇文章中，我们将全面讲解这两个方法的使用，以便更好地掌握其用法。

使用$.each

$.each方法主要用来遍历一个对象或数组，可以传递两个参数：第一个参数是对象或数组，第二个参数是对每个元素进行操作的回调函数。下面是一个使用$.each遍历数组的例子：

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

在这个例子中，我们传递了一个包含三个数字的数组，然后用$.each遍历了这个数组。在回调函数中，我们输出了每个元素的下标和值。

使用$(selector).each

与$.each不同，$(selector).each方法针对的是选择器选中的所有元素集合。它的用法与$.each类似，也需要传递一个回调函数来进行操作。下面是一个使用$(selector).each遍历所有段落元素的例子：

$("p").each(function() {
  console.log($(this).text());
});

在这个例子中，我们使用了选择器$("p")选中了所有的段落元素，并对它们进行遍历。在回调函数中，我们输出了每个段落元素的文本内容。

需要注意的是，$(selector).each方法中回调函数的参数与$.each方法中是不同的。$(selector).each方法中回调函数的参数仅为当前遍历到的元素，而不包括下标和原始对象/数组等信息。

总结

通过以上两个例子，我们可以看到$.each和$(selector).each方法的用法和区别。$.each方法主要用来遍历单一对象或数组，而$(selector).each方法用来遍历选择器选中的所有元素。希望这篇攻略能够帮助您更好地理解这两个方法的用法，从而更好地应用它们在实际开发中。