each(callback) 与each(object[, callback])的区别

最新推荐文章于 2020-07-31 10:47:30 发布
最新推荐文章于 2020-07-31 10:47:30 发布
阅读量134 收藏
点赞数
文章标签： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43566612/article/details/107708290
版权

each(callback)：每个匹配的元素都会执行该函数

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="./js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<input type="checkbox" name="hobby" id="1" value="1" checked="checked" />篮球
		<input type="checkbox" name="hobby" id="2" value="2" />乒乓球
		<input type="checkbox" name="hobby" id="3" value="3" />足球
		<script type="text/javascript">
			$("[name='hobby']").each(function(){
				console.log(this);
			});
		</script>
	</body>
</html>

此时：参数实参所指函数中的this 指代的是 DOM 对象而非 jQuery 对象； 如果在函数中使用jQuery对象，可以通过 $(this) 方式进行转换。

each(object[, callback])：用于遍历对象（可以是jQuery对象）和数组，其中object表示待遍历的jQuery对象或数组；callback表示每个成员/元素执行的回调函数，

如下例子：

 

遍历数组：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="./js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
        <script type="text/javascript">
		var names=["jim","tom"];
			$.each(names,function(i, name){
				console.log(i+":"+name);
			}); 
		</script>
	</body>
</html>

遍历jQuery对象：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="./js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<input type="checkbox" name="hobby" id="1" value="1" checked="checked" />篮球
		<input type="checkbox" name="hobby" id="2" value="2" />乒乓球
		<input type="checkbox" name="hobby" id="3" value="3" />足球
		<script type="text/javascript">
			$("[name='hobby']").each(function(){
				console.log(this);
			});
			$.each($("[ name='hobby']"),function(i,name){
				console.log(i+":"+name);
			});
		</script>
	</body>
</html>

liulu璐
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
each(callback)与each(object[, callback])区别
QBjie的博客
07-31 129
一.each(callback)：每个匹配的元素都会执行该函数，只能遍历jQuary对象。例： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script> </head&
HTML中详述each（callback）与each（object [，callback]）方法区别
zzu957的博客
07-31 578
each(callback) each(callback)：每个匹配的元素都会执行该函数， each(object[, callback])：用于遍历对象（可以是jQuery对象）和数组，其中object表示待遍历的jQuery对象或数组；callback表示每个成员/元素执行的回调函数 代码示例： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title
jQuery.each(object, [callback])方法，用于处理json数组
weixin_34185364的博客
11-27 108
通用例遍方法，可用于例遍对象和数组。 不同于例遍 jQuery 对象的 $().each() 方法，此方法可用于例遍任何对象。回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false，其它返回值将被忽略。 object:需要例遍的对象或数组。 callback:每个成员/元素执行的回调函数。 ...
each(callback)与each(object[, callback])
zyt1204732670的博客
07-31 126
<body> <input type="checkbox" name="hobby" value="1" checked="checked"/>足球 <input type="checkbox" name="hobby" value="2"/>篮球 <input type="checkbox" name="hobby" value="3" checked="checked"/>乒乓球 <script> ...
JQuery二级联动 （ each(callback)，$.each(object, [callback])）
qq_41566772的博客
11-01 293
1.each(callback) HTML 代码: &lt;img/&gt;&lt;img/&gt; jQuery 代码: $("img").each(function(i){ this.src = "test" + i + ".jpg"; }); 结果: [ &lt;img src="test0.jpg" /&gt;, &lt;img src=&
jQuery中each(callback)与each(object[], callback)方法
Gong_Zheng6的博客
07-31 251
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Test</title> <script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script> </head> <body> <input type="chec.
jQuery each函数源码分析
11-22
each: function(object, callback, args) { var name, i = 0, length; // 检查object是否为对象，排除数组和函数 var isObj = length === undefined || jQuery.isFunction(object); // 当有附加参数时 if ...
jquery中$each()方法的使用指南
12-11
$.each()与$(selector).each()不同, 后者专用于jquery对象的遍历, 前者可用于遍历任何的集合(无论是数组或对象),如果是数组,回调函数每次传入数组的索引和对应的值(值亦可以通过this 关键字获取,但javascript总会...
关于jQuery中的each方法(jQuery到底干了什么)
01-19
找到jquery中的each源码： 代码如下: each: function( object, callback, args ) { var name, i = 0, length = object.length, isObj = length === undefined || jQuery.isFunction( object ); if ( args ) { if ( ...
原生js实现each方法实例代码详解
01-21
jquery里面有个each方法，将循环操作简化、便捷。 随后es出了个forEach方法，两个虽然用法相近，但是不能处理对象类型。且无法通过return true达到continue...var each = function(object, callback){ var type =
JQuey之学“.each(callback)”与“$.each(array,callback)”
WEB_G
03-25 436
这两个函数，我一直都没怎么使用过。今天在看别人的代码的时候，看到了其中的一种。 $.getPOST(url,function(data){   //返回的数据是图片 $.each(data.items,function(i,item){ //创建图片，并添加到body下 $("").attr("src",date.srcurl).appendTo("body");
ant-design-vue-2.0.0-beta.5.zip
08-26
基于 Ant Design 和 Vue 的企业级 UI 组件库
ant-design-vue-1.1.1.zip
08-26
基于 Ant Design 和 Vue 的企业级 UI 组件库
ssm464基于java的可视化高校公寓管理系统+vue.zip
08-26
现代经济快节奏发展以及不断完善升级的信息化技术，让传统数据信息的管理升级为软件存储，归纳，集中处理数据信息的管理方式。本可视化高校公寓就是在这样的大环境下诞生，其可以帮助管理者在短时间内处理完毕庞大的数据信息，使用这种软件工具可以帮助管理人员提高事务处理效率，达到事半功倍的效果。此可视化高校公寓利用当下成熟完善的SSM框架，使用跨平台的可开发大型商业网站的Java语言，以及最受欢迎的RDBMS应用软件之一的Mysql数据库进行程序开发。实现了用户在线选择试题并完成答题，在线查看考核分数。管理员管理班级管理、每日打卡管理、字典管理、访客管理、宿舍缴费记录管理、离校登记管理、宿舍管理、宿舍管理员管理、物品进出登记管理、学生管理、住宿信息管理、管理员管理等功能。可视化高校公寓的开发根据操作人员需要设计的界面简洁美观，在功能模块布局上跟同类型网站保持一致，程序在实现基本要求功能时，也为数据信息面临的安全问题提供了一些实用的解决方案。可以说该程序在帮助管理者高效率地处理工作事务的同时，也实现了数据信息的整体化，规范化与自动化。
论坛小程序源码 论坛小程序代码（高分毕设项目源码）
08-26
1. 论坛小程序代码说明：经导师指导并认可通过的98分毕设项目代码。 2.适用对象：本代码学习资料适用于计算机、电子信息工程、数学等专业正在做毕设的学生，需要项目实战练习的学习者，也适用于课程设计、期末大作业。 3.技术栈：java，项目代码都经过严格调试，代码没有任何bug！ 4. 作者介绍：大厂码农，java领域创作者，阿里云开发社区乘风者计划专家博主，专注于大学生项目实战开发，文章底部有博主联系方式，更多优质系统、项目定制请私信。 5. 最新计算机软件毕业设计选题大全: https://blog.csdn.net/weixin_45630258/article/details/135901374
springboot379防疫物资管理信息系统pf.zip
08-26
防疫物资管理信息系统可以对防疫物资管理信息系统信息进行集中管理，可以真正避免传统管理的缺陷。防疫物资管理信息系统是一款运用软件开发技术设计实现的应用系统，在信息处理上可以达到快速的目的，不管是针对数据添加，数据维护和统计，以及数据查询等处理要求，防疫物资管理信息系统都可以轻松应对。所以，防疫物资管理信息系统的运用是让防疫物资管理信息系统信息管理升级的最好方式。它可以实现信息处理的便利化要求，还可以规范信息处理的流程，让事务处理成为管理人员手中的一件简单事，而不是之前手工处理时的困难事。尽管防疫物资管理信息系统具备较完善的功能，但是也需要管理人员利用闲暇时间提升自身素质以及个人能力，在操作防疫物资管理信息系统时可以最大化运用防疫物资管理信息系统提供的功能，让系统在满足高效率处理数据的同时，也能始终稳定运行，还可以确保数据的可靠性与数据处理的质量。
ant-design-vue-2.0.0-rc.4.zip
最新发布
08-26
基于 Ant Design 和 Vue 的企业级 UI 组件库
router.beforeEach
04-03
router.beforeEach is a method in Vue Router that is used to register a global navigation guard. This method is called before each route navigation and allows you to control access to the routes based ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值