Detailed description of how to use each in jquery

The each () function is a tool-class function provided by almost all frameworks. Through it, You can traverse and process the attribute values of objects and arrays. This method is implemented by jQuery and jQuery objects. For jQuery objects, the each method is simply delegated: The jQuery object is passed to jQuery's each method as the first parameter. in other words, the each method provided by jQuery calls all the child elements of the object provided by parameter 1 one by one. The each method provided by the jQuery object calls the child elements of the jQuery internal part one by one.

The core code in JQUERY
Copy codeThe Code is as follows:
JQuery. prototype. each = function (fn, args ){
Return jQuery. each (this, fn, args );
}

Let's take a look at the specific implementation of the each method provided by jQuery,
JQuery. each (obj, fn, arg)
This method has three parameters: the object for the operation (obj), the fn function for the operation, and The args parameter of the function.
Let's discuss it based on the ojb object:

1. The obj object is an array.
The each method calls the fn function one by one for the sub-elements of the array until the returned result of a sub-element is false. That is to say, we can process the fn function provided, exit the each method call after certain conditions are met. When the each method provides the arg parameter, the incoming parameter of the fn function call is arg. Otherwise, it is a sub-element index and the sub-element itself.
2. The obj object is not an array.
The biggest difference between this method and 1 is that the fn method will be carried out without considering the return value. In other words, all properties of the obj object are called by the fn method, even if the fn function returns false. The input parameters of the call are similar to those of 1.
Copy codeThe Code is as follows:
JQuery. each = function (obj, fn, args ){
If (args ){
If (obj. length = undefined ){
For (var I in obj)
Fn. apply (obj, args );
} Else {
For (var I = 0, ol = obj. length; I <ol; I ++ ){
If (fn. apply (obj, args) = false)
Break;
}
}
} Else {
If (obj. length = undefined ){
For (var I in obj)
Fn. call (obj, I, obj );
} Else {
For (var I = 0, ol = obj. length, val = obj [0]; I <ol & fn. call (val, I, val )! = False; val = obj [++ I]) {}
}
}
Return obj;
}

Note that the call method of fn in the each method does not use simple fn (I, val) or fn (args), but uses fn. call (val, I, val) or fn. apply (obj. args), which means that in your own fn implementation, you can directly use the this pointer to reference arrays or child elements of objects. This is an implementation method adopted by the vast majority of jQuery.

Let's explain it through an instance.

First look at the Code:
Copy codeThe Code is as follows:
$ ("# Submit"). click (function (){
Try {
$ ('# LeftTbl tr'). each (function (I ){
Var emailInput = $ ("# email _" + (1 + I ));
If (! Re. test (emailInput. val ())){
Alert ("Please enter email correctly ");
EmailInput. focus ();
Throw emailInput;
} Else {
Email = emailInput. val ();
}
});
} Catch (e ){
Return false;
}
$ ("# Pageform"). submit ();
});

It is implemented through throw and catch, and the counter can be used to determine its value at the end!

The above Code seems to have nothing to do with the title, so how to implement break and continue in each is actually related to the following...
Copy codeThe Code is as follows:
$ ('Input'). each (function (){
If ($ (this). val () = ''){
// Do something
If (1 = 1) return false; // use return false to exit the loop.
Else return true; // use return true to enter the next loop.
}
});

In jquery, You Should iterate each element and view the returned value to determine whether to continue iteration of the next element.
Original article. For more information, see www.tlbar.com.cn.
Copy codeThe Code is as follows:
Var arr = ["one", "two", "three", "four"];
$. Each (arr, function (){
Alert (this );
});
// The above each output results are: one, two, three, four
Var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]
$. Each (arr1, function (I, item ){
Alert (item [0]);
});
// In fact, arr1 is a two-dimensional array, and item is equivalent to taking every one-dimensional array,
// Item [0] is relative to the first value in each one-dimensional array.
// Therefore, the above each output is: 1 4 7
Var obj = {one: 1, two: 2, three: 3, four: 4 };
$. Each (obj, function (key, val ){
Alert (obj [key]);
});
// This each is even more powerful and can loop through every attribute.
// Output result: 1 2 3 4