jquery的each方法
jQuery 的 each() 方法
jQuery 的 each() 方法用于遍历一个 jQuery 对象或数组/对象,并对每个元素执行回调函数。它有两种形式:一种用于遍历 jQuery 对象,另一种用于通用遍历(类似 $.each())。
遍历 jQuery 对象
语法:
$(selector).each(function(index, element) {
// 操作逻辑
});
index:当前元素的索引。element:当前 DOM 元素(可直接用this代替)。
示例:
$('li').each(function(index) {
console.log(index + ': ' + $(this).text());
});
通用遍历($.each())
语法:
$.each(collection, function(index, value) {
// 操作逻辑
});
collection:可以是数组或对象。index:数组的索引或对象的键。value:数组的值或对象的属性值。
示例(遍历数组):
var arr = ['a', 'b', 'c'];
$.each(arr, function(index, value) {
console.log(index + ': ' + value);
});
示例(遍历对象):
var obj = { name: 'John', age: 30 };
$.each(obj, function(key, value) {
console.log(key + ': ' + value);
});
中断遍历
在回调函数中返回 false 可以中断遍历(类似 break)。返回 true 会跳过当前迭代(类似 continue)。
示例:

$.each([1, 2, 3, 4], function(index, value) {
if (value === 3) return false; // 中断遍历
console.log(value);
});
与原生 forEach 的区别
each()可以遍历 jQuery 对象和通用集合,而forEach仅用于数组。each()支持中断逻辑(return false),而forEach无法直接中断。
注意事项
- 使用
$(this)或element访问 DOM 元素时,确保元素存在。 - 对于性能敏感的场景,原生循环(如
for)可能更快。






