在 jQuery 中，要对一组元素进行操作时，可以使用 $(selector).each()、$.each() 或者普通的 for 循环。那么这三种方式有何区别呢？本文将详细介绍它们的不同之处，并提供相应示例代码。
1. $(selector).each()
$(selector).each() 方法是 jQuery 对象中的一个方法，用于遍历匹配选择器的元素集合。它会为集合中的每个元素执行指定的函数。该方法返回其调用者（即 jQuery 对象），因此可以链式调用其他方法。
下面是一个使用 $(selector).each() 的示例，它会将每个段落的内容改为“Hello World!”：
---------------------- - ------------------- --------- ---
该代码遍历了文档中所有的 <p> 元素，然后将它们的文本内容设置为 "Hello World!"。
2. $.each()
$.each() 方法是 jQuery 库中的一个全局函数，用于遍历任何可迭代对象，包括数组、对象和类数组。它与 $(selector).each() 不同，因为它不需要先将选择器转换为 jQuery 对象。该方法还支持一个可选的上下文参数（即 this 的值）。
下面是一个使用 $.each() 的示例，它会将数组中的每个元素都平方：
--- ---- - --- -- -- --- ------------ --------------- ------ - ----------- - ----- - ------ --- ------------------ -- -- --- -- -- ---
该代码遍历了数组 nums 中的每个元素，然后将它们平方并更新原数组。
3. for 循环
普通的 for 循环与上述两种方法不同，因为它需要手动迭代元素，并提供条件判断以控制循环。由于 jQuery 对象不是一个真正的数组，因此使用 for 循环时需要使用像 .length 这样的属性来获取集合的大小。
下面是一个使用 for 循环的示例，它会将每个段落的内容改为“Hello World!”：
--- ---------- - ----------------------------------- --- ---- - - -- - - ------------------ ---- - ------------------------- - ------ -------- -
该代码使用 getElementsByTagName() 方法获取文档中所有的 <p> 元素，然后遍历它们并将它们的文本内容设置为 "Hello World!"。
总结
尽管三种方式都可以遍历元素，并执行指定的操作，但它们之间有些微小的区别：
$(selector).each()：用于遍历 jQuery 对象中的元素集合。$.each()：用于遍历任何可迭代对象，包括数组、对象和类数组。for循环：使用原生 JavaScript 方法遍历元素（需要手动获取集合的大小）。
在实际开发中，我们应该选择最适合当前场景的方法。比如，如果我们要针对 jQuery 对象中的一组元素执行操作，则使用 $(selector).each() 是最好的选择；如果我们要遍历一个数组或对象，则使用 $.each() 更加方便；如果没有 jQuery 库，则必须使用 for 循环。
总而言之，熟练掌握不同的循环方式可以提高代码的可读性和效率，并帮助我们更好地理解 jQuery 和 JavaScript 的工作原理。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/26341