each(callback)与each(object[, callback])

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

each(callback)：每个匹配的元素都会执行该函数，如下例子：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>each(callback)函数</title>
		<script src="js/jquery-3.3.1.js"></script>
	</head>
	<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>
			var result = "";
			$("input[type=checkbox]").each(function() {
				if(this.checked){
					result =result+ ","+this.value;
				}
			});
			if(result != ""){
				result = result.substr(1);
			}
			console.log(result);
		</script>
	</body>
</html>

注意：参数实参所指函数中的this 指代的是 DOM 对象而非 jQuery 对象； 如果在函数中使用jQuery对象，可以通过 $(this) 方式进行转换。
each(object[, callback])：用于遍历对象（可以是jQuery对象）和数组，其中object表示待遍历的jQuery对象或数组；callback表示每个成员/元素执行的回调函数，如下例子：
1、遍历数组：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>遍历数组</title>
		<script src="js/jquery-3.3.1.js"></script>
	</head>
	<body>
		<script>
			var names = ["Tom","Jim"];
			$.each(names, function(index, value){
				console.log(index + ":" + value ); 
			});
		</script>
	</body>
</html>

2、遍历jQuery对象：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>遍历jQuery对象</title>
		<script src="js/jquery-3.3.1.js"></script>
	</head>
	<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>
			var result = "";
			$.each($("input[type=checkbox]"), function(){
				if(this.checked){
					result =result+ ","+this.value;
				}
			});
			if(result != ""){
				result = result.substr(1);
			}
			console.log(result);
		</script>
	</body>
</html>

each(callback)与each(object[, callback])区别：
1、调用对象不同：前者必须使用jQuery对象调用；后者只能使用$调用；
2、遍历对象不同：前者遍历的是jQuery对象；后者还可以遍历数组等非jQuery对象；

pi5458
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
each(callback)与each(object[, callback])区别
深海潜蛟的博客
07-31 115
each(callback)：遍历jQuery对象，每个匹配的元素都会执行该函数 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/jscript" src="js/jquery-1.8.3.js"></script> </head> <body&g
原生js实现each方法实例代码详解
01-21
jquery里面有个each方法，将循环操作简化、便捷。 随后es出了个forEach方法，两个虽然用法相近，但是不能处理对象类型。且无法通过return true达到continue...var each = function(object, callback){ var type =
jQuery(each)函数
qq_44883796的博客
10-08 217
each(callback)  以每一个匹配的元素作为上下文来执行一个函数。 意味着，每次执行传递进来的函数时，函数中的this关键字都指向一个不同的DOM元素（每次都是一个不同的匹配元素）。而且，在每次执行函数时，都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数（从零开始的整型）。 返回 ‘false’ 将停止循环 (就像在普通的循环中使用 ‘break’)。返回 ‘true’ 跳至下一个循环(就像在普通的循环中使用’continue’)。 参数callback
HTML中详述each（callback）与each（object [，callback]）方法区别
zzu957的博客
07-31 547
each(callback) each(callback)：每个匹配的元素都会执行该函数， each(object[, callback])：用于遍历对象（可以是jQuery对象）和数组，其中object表示待遍历的jQuery对象或数组；callback表示每个成员/元素执行的回调函数 代码示例： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title
关于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 ( ...
jquery中$each()方法的使用指南
12-11
$.each()与$(selector).each()不同, 后者专用于jquery对象的遍历, 前者可用于遍历任何的集合(无论是数组或对象),如果是数组,回调函数每次传入数组的索引和对应的值(值亦可以通过this 关键字获取,但javascript总会...
jQuery.each使用详解
12-10
object:需要例遍的对象或数组。 callback:每个成员/元素执行的回调函数。 回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false，其它...
jquery each()源代码
12-09
代码如下: // args is for internal usage only each: function( object, callback, args ) { var name, i = 0, length = object.length, isObj = length === undefined || jQuery.isFunction(object); if ( args ) ...
each(callback)与each(object[, callback])的异同
x_j_k_jysg的博客
07-31 122
each(callback)：每个匹配的元素都会执行该函数，如下例子： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>each(callback)函数</title> <script src="js/jquery-3.3.1.js"></script> </head> <body> &l
jquery的each(callback)回调函数(十二)
有 prepare , No out
01-07 3069
描述: 迭代两个图像，并设置它们的 src 属性。注意:此处 this 指代的是 DOM 对象而非 jQuery 对象。 HTML 代码: jQuery 代码: $("img").each(function(i){ this.src = "test" + i + ".jpg"; }); 结果: [ , ]
在看jQuery源码，jQuery.each()写的非常精粹
李子的专栏
07-31 3423
each源码 $('#img').each(callback); jquery的each方法是调用jquery.fn.each方法，$('img')是dom数组集合。 each: function( callback, args ) { return jQuery.each( this, callback, args ); // this是选择器结果array } 有几个值得借
jQuery.each(object, [callback])方法，用于处理json数组
pankhong blog
05-05 228
通用例遍方法，可用于例遍对象和数组。 不同于例遍 jQuery 对象的 $().each() 方法，此方法可用于例遍任何对象。回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false，其它返回值将被忽略。 object:需要例遍的对象或数组。 callback:每个成员/元素执行的回调函数。 jQuery 代码...
jQuery——each(callback)与each(object，[callback])
qq_44687512的博客
07-31 210
1、each(callback)与each(object，[callback])区别： （1）调用对象不同：前者必须使用jQuery对象调用；后者只能使用$调用； （2）遍历对象不同：前者遍历的是jQuery对象；后者还可以遍历数组等非jQuery对象； 2、each(callback) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></tit.
JQuery二级联动 （ each(callback)，$.each(object, [callback])）
qq_41566772的博客
11-01 284
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)
theowl的专栏
11-27 614
each(callback) 概述 以每一个匹配的元素作为上下文来执行一个函数。 意味着，每次执行传递进来的函数时，函数中的this关键字都指向一个不同的DOM元素（每次都是一个不同的匹配元素）。而且，在每次执行函数时，都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数（从零开始的整型）。 返回 'false' 将停止循环 (就像在普通
JQuery中遍历DOM元素each(callback)函数
ystyaoshengting的专栏
08-18 4140
each(callback): 以每一个匹配的元素作为上下文来执行一个函数。 意味着，每次执行传递进来的函数时，函数中的this关键字都指向一个不同的DOM元素（每次都是一个不同的匹配元素）。 而且，在每次执行函数时，都会给函数传递一个表示作为执行环境的元素在匹配的元素集
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 on certain conditions. For example, you can use this method to check if the user is authenticated before allowing access to protected routes. If the user is not authenticated, you can redirect them to the login page. The syntax for using router.beforeEach is as follows: ``` router.beforeEach((to, from, next) => { // your navigation guard logic here }) ``` The first parameter is a function that takes three arguments: - `to`: the route object of the destination route - `from`: the route object of the current route - `next`: a callback function that must be called to proceed with the navigation Inside the function, you can write your navigation guard logic and call the `next` function to proceed with the navigation or to redirect the user to a different route. Here's an example of using router.beforeEach to check if the user is authenticated before allowing access to protected routes: ``` router.beforeEach((to, from, next) => { const isAuthenticated = checkAuthentication() // your authentication logic here if (to.meta.requiresAuth && !isAuthenticated) { next({ name: 'login' }) // redirect to login page } else { next() // proceed with the navigation } }) ``` In this example, we're checking if the destination route requires authentication (`to.meta.requiresAuth`) and if the user is authenticated (`isAuthenticated`). If the user is not authenticated, we're redirecting them to the login page (`next({ name: 'login' })`). If the user is authenticated, we're proceeding with the navigation (`next()`).

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值