JQuery中的each()方法和$.each()函数的使用

发布时间 2023-06-24 18:01:16作者: じ逐梦

1、元素(对象).each()方法的使用

JQuery提供了 each() 方法用于遍历匹配的元素信息。以每一个匹配的元素作为上下文来执行一个函数。每次执行传递进来的函数时,函数中的 this 关键字都指向一个不同的DOM元素(每次都是一个不同的匹配元素)。而且,在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整型)。 返回 'false' 将停止循环(就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue')。
例如:

对象.each();

 //用户编号数组
 var idArray = new Array();
 //使用each()方法,遍历选中的用户编号
 $("[name=checkItem]:checkbox:checked").each(function(index){
     idArray.push($(this).val());
 });
//打印结果
console.log(idArray);

输出

 示例二:

元素.each

 遍历一个元素

var newValue="";
var v="id";
$(data).each(function (index, dom) {
     //dom为遍历这个数组每次的值  获取数组中所有的id值相加
     newValue += dom[v];
});

 

 最后取出了里面的id值;

2、 $.each()

JQuery还提供了一个通用的遍历方法 $.each(),可以用于遍历对象和数组。$.each() 函数不同于 JQuery 对象的 each() 方法,它是一个全局函数,不操作 JQuery 对象,而是以一个数组或对象作为第1个参数,以一个回调函数作为第2个参数。在回调函数中拥有两个参数:第1个参数为对象的成员或数组的索引,第2个参数为对应变量或内容。如果需要退出 $.each() 循环可使回调函数返回 false,其它返回值将被忽略。
原文链接:https://blog.csdn.net/pan_junbiao/article/details/107682956

 遍历一个元素和上面第二种用法相似

//使用$.each()函数,遍历数据
$.each(data,function(index,item)
{
      html += " 索引:" + index;
      html += " 用户编号:" + item.userId;
      html += " 用户名称:" + item.userName;
      html += " 博客信息:" + item.remark;
      html += "<br>";
}