Home > Web Front-end > JS Tutorial > What does the each() method in jQuery do?

What does the each() method in jQuery do?

清浅
Release: 2018-12-13 09:11:21
Original
6412 people have browsed it

The main function of each() method in jQuery is to loop through different data. We can use it to loop through multiple DOM objects from the same selector

What I will introduce to you today is the usage of each() function in jQuery, which allows us to loop through different data, such as arrays or objects. The each() function in jQuery is one of the most commonly used functions in jQuery. The following article will introduce the use of this method in detail.

【Recommended courses: jQuery Tutorial

What does the each() method in jQuery do?

##The each() function in jQuery is used to loop data, similar to the for each loop. So we can use this to loop through multiple DOM objects from the same selector

each() method

Specifies the function to be run for each matching element.

$(selector).each(function(index,element))
Copy after login

function(index,element): Specifies the function to be run for each matching element.

index: The index position of the selector, get the index value

element: The current element (the "this" selector can also be used)

When inside the each function , we can access the current element by using the this keyword, but this object is not a jQuery object

$("a").each(function(){
$(this);
})
Copy after login

Get the current index of the loop

<body>
<ul>
	<li>1</li>
	<li>2</li>
	<li>3</li>
	<li>4</li>
	<li>5</li>
</ul>
<script src="jquery/jquery-1.12.4.js"></script>
<script>
	$(function(){
		$("li").each(function(i){
			console.log(i);
		})
	})
</script>
	</body>
Copy after login

The result is as shown below:

What does the each() method in jQuery do?

Loop through an array:

You can use this to iterate through an array and get the index value and the value of the position in the array.

<script src="jquery/jquery-1.12.4.js"></script>
<script>
var array=[&#39;Chinese&#39;,&#39;Math&#39;,&#39;English&#39;]
	
$.each(array,function(index,value){
console.log(index+":"+value);
})
</script>
Copy after login

The result is as shown below:

What does the each() method in jQuery do?

#Loop object:

You can use it to traverse the object and get the index value and position in the object.

<script src="jquery/jquery-1.12.4.js"></script>
<script>
	var obj={
	name:"张三",
	age:"18",
	subject:"English"
};
$.each(obj,function(index,value){
console.log("信息:"+index+":"+value);
		})

</script>
Copy after login

The results are as follows:


What does the each() method in jQuery do?

Summary: The above is the entire content of this article. I hope that this article can make everyone understand Have a certain understanding of each() method in jQuery.


The above is the detailed content of What does the each() method in jQuery do?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template