Traversal: jquery $().each and $.each()

In jquery, traverse objects and arrays, often using $().each and $.each(), both method.

$().each is often used in DOM processing. If the page has multiple input tags type is checkbox, use $().each to process multiple checkbooks, for example:

<br>##

<span style="font-family: 宋体;">$(“input[name=’ch’]”).each(<span style="color: #0000ff;">function</span><span style="color: #000000;">(i){</span><span style="color: #0000ff;">if</span>($(<span style="color: #0000ff;">this</span>).attr(‘checked’)==<span style="color: #0000ff;">true</span><span style="color: #000000;">)
{</span><span style="color: #008000;">//</span><span style="color: #008000;">一些操作代码</span><span style="color: #000000;">}<br><a href="http://www.php.cn/code/8530.html" target="_blank">回调函数</a>是可以传递参数，i就为遍历的索引。<br></span></span>

Traversing an array is usually handled with $.each() For example:

<br>

<br>

$.each([{name:"limeng",email:"xfjylimeng"},{name:"hehe",email:"xfjylimeng"}],function(i,n)

{<br>alert( "Index:"+i+"The corresponding value is:"+n.name);<br>});<br>

The parameter i is the traversal index value, n is the current traversal object.

<br>var arr1 = [ "one", "two", "three", "four", "five" ];<br>$.each(arr1, function(){<br>alert(this);<br>});<br>输出：one   two  three  four   five<br><br>var arr2 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]<br>$.each(arr2, function(i, item){<br>alert(item[0]);<br>});<br>输出：1   4   7<br><br>var obj = { one:1, two:2, three:3, four:4, five:5 };<br>$.each(obj, function(key, val) {<br>alert(obj[key]);<br>});<br>输出：1   2  3  4  5<br>

In fact, the each method in jQuery is implemented through the call method in js.

The following is a brief introduction to the call method. <br>The call method is very wonderful. In fact, the official description is: "Call a method of an object and replace the current object with another object." More explanations on the Internet are to change the context environment, and some also say It is to change the context this pointer. <br>call([thisObj[,arg1[, arg2[, [,.argN]]]]])

Parameters <br>thisObj<br>Optional. The object that will be used as the current object. <br>arg1, arg2, , argN<br>Optional. A sequence of method parameters will be passed.

Description<br>The call method can be used to call a method instead of another object. The call method changes the object context of a function from the initial context to the new object specified by thisObj.

Quote There is a very classic example on the Internet

Js code

<br>

function add(a,b){
alert(a+b);}<br>function sub(a,b){
alert(a-b);}<br>add.call(sub,3,1);

Replace sub with add, add.call(sub,3,1) == add(3,1), so The running result is: alert(4);<br>Note: Functions in js are actually objects, and the function name is a reference to the Function object.

Let’s mention some common uses of jQuery’s each method

Js code<br>var arr = [ “one”, “two”, “three”, “four”];<br>$.each( arr, function(){<br>alert(this);<br>});<br>//The results output by each above are respectively For: one, two, three, four

var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]<br>$.each(arr1, function(i, item){<br>alert(item[0]);<br>});<br>//其实arr1为一个二维数组，item相当于取每一个一维数组，<br>//item[0]相对于取每一个一维数组里的第一个值<br>//所以上面这个each输出分别为：1   4   7

var obj = { one:1, two:2, three:3, four:4};<br>$.each(obj, function(key, val) {<br>alert(obj[key]);<br>});<br>//这个each就有更厉害了，能循环每一个属性<br>//输出结果为：1   2  3  4

 

jQuery each源码

 

<br>

each: function( obj, callback ) {        var length, i = 0;        if ( isArrayLike( obj ) ) {
            length = obj.length;            for ( ; i < length; i++ ) {                if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {                    break;
                }
            }
        } else {            for ( i in obj ) {                if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {                    break;
                }
            }
        }        return obj;
    }

 

The above is the detailed content of Traversal: jquery $().each and $.each(). For more information, please follow other related articles on the PHP Chinese website!