Jquery는 each 함수를 사용하여 반복 및 그룹 처리를 실현합니다

each () 메서드는 DOM 루프 구조를 단순화하여 오류가 발생하지 않도록 합니다.each () 함수는 매우 강력한 역행 기능을 봉하여 사용도 편리하다. 일차원 그룹, 다차원 그룹, DOM, JSON 등을 역행할 수 있다
javaScript 개발 과정에서 $each를 사용하면 우리의 작업량을 크게 줄일 수 있습니다.
다음은 each의 몇 가지 자주 사용하는 용법을 제시합니다
each 처리 1차원 그룹

 var arr = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]   
   $.each(arr, function(i, item){   
     $.each(item,function(j,val){
         alert(j);
        alert(val);
   }); 
});  
alert(i)는 0, 1, 2를 출력합니다.
alert(val)는 aa,bb,ccc를 출력합니다
each 처리 2차원 그룹

  var arr2 = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']] 
  $.each(arr, function(i, item){ 
alert(i); 
alert(item); 
  }); 
arr2는 2차원 그룹입니다. item은 이 2차원 그룹의 모든 그룹을 취하는 것과 같습니다.
item[0]은 모든 1차원 그룹의 첫 번째 값을 취하는 것에 비해
alert (i) 는 0, 1, 2로 출력됩니다. 이 2차원 그룹은 3개의 그룹 요소를 포함하기 때문입니다.
alert(item)는 ['a','aa','aaa'], ['b','bb','bb'], ['c','cc','ccc'] 로 출력됩니다.
이 두 자릿수 그룹의 처리를 잠시 변경한 후

var arr = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']] 
  $.each(arr, function(i, item){ 
  $.each(item,function(j,val){
     alert(j);
    alert(val);
 }); 
}); 
alert(j)는 0, 1, 2, 0, 1, 2, 0, 1, 2로 출력됩니다.
alert(val)는 a,aa,aa,b,bb,bb,c,ccc로 출력됩니다.
each 처리 json 데이터, 이 each는 더욱 심해지고 모든 속성을 순환할 수 있습니다

   var obj = { one:1, two:2, three:3};   
   each(obj, function(key, val) {   
     alert(key);  
     alert(val);   
   });  
여기alert (key) 는 one two three 를 출력합니다.
alert(val)는 one, 1, two, 2, three, 3을 출력합니다.
이쪽은 왜 키가 숫자가 아니라 속성입니까? 왜냐하면 json 형식 안에 무질서한 속성-값이 있기 때문입니다. 무질서한 이상 무슨 숫자가 있겠습니까?
이 val은obj[key]와 같다
ecah는dom 요소를 처리합니다. 여기에는 input 폼 요소를 예로 들 수 있습니다.
하면, 만약, 만약...




그리고 너는 each를 아래와 같이 사용해라.

 $.each($("input:hidden"), function(i,val){ 
   alert(val);
   alert(i);
   alert(val.name);
   alert(val.value);  
 }); 
그러면 alert(val)는 폼 요소이기 때문에 [object HTMLInputElement]를 출력합니다.
alert (i) 는 0, 1, 2, 3으로 출력됩니다.
alert(val.name);aaa,bbb,ccc,ddd를 출력합니다.this를 사용하면name는 같은 결과를 출력합니다
alert(val.value); this를 사용하면 111222333444를 출력합니다.value는 같은 결과를 출력합니다
하면, 만약, 만약...

$("input:hidden").each(function(i,val){
  alert(i);
  alert(val.name);
  alert(val.value);    
});
출력의 결과가 똑같다는 것을 알 수 있는데, 두 가지 작법의 도대체 차이가 어디에 있는지 나도 아직 모른다.이 변경 사항을 상기 몇 단락의 수조에 운용하는 조작도 같은 결과를 출력할 수 있다.
이렇게 해서 몇 가지 예의 실제 결과는 이미 답을 얻었다.이어서 계속 연구하면 그 이유를 알 수 없다.
이상의 예에서 알 수 있듯이 jQuery와 jQuery 대상은 모두 이 방법을 실현했다. jQuery 대상에 대해 each 방법을 간단하게 의뢰했다. jQuery 대상을 첫 번째 매개 변수로 jQuery에게 전달하는 each 방법이다.
jQuery의 each 구현 보기(네트워크 베끼기)

function (object, callback, args) {
// : obj, fn, args
  var name, i = 0,length = object.length;
  if (args) {
    if (length == undefined) {
      for (name in object) {
        if (callback.apply(object[name], args) === false) {
          break;
        }
      }
    } else {
      for (; i < length;) {
        if (callback.apply(object[i++], args) === false) {
          break;
        }
      }
    }
  } else {
    if (length == undefined) {
      for (name in object) {
        if (callback.call(object[name], name, object[name]) === false) {
          break;
        }
      }
    } else {
      for (var value = object[0]; i < length && callback.call(value, i, value) !== false; value = object[++i]) {}
      /*object[0] jQuery DOM , for ,
       jQuery DOM ,  callback.call( value,i,value);
       callback this value , ,i ,value DOM ;
       callback  function(index, elem) { ... }  。
        $("...").each(function(index, elem){ ... });
      */
    }
  }
  return object;
}
jquery는 자동으로 전송된 요소에 따라 판단하고 판단 결과에 따라 apply 또는call 방법으로 처리합니다.fn의 실현에서this 바늘로 수조나 대상의 하위 요소를 직접 인용할 수 있다.
1.obj 객체는 배열입니다.
each 방법은 수조 중성자 원소의 하나하나에 fn 함수를 호출합니다. 어떤 하위 원소가 되돌아오는 결과가false가 될 때까지. 즉, 우리는 제공된 fn 함수를 처리하여 일정한 조건을 만족시킨 후에 each 방법 호출을 종료할 수 있습니다.each 방법이arg 파라미터를 제공할 때 fn 함수는 전송된 파라미터를arg로 호출합니다. 그렇지 않으면: 하위 요소 인덱스, 하위 요소 자체
2.obj 객체는 배열이 아닙니다.
이 방법과 1의 가장 큰 차이점은 fn 방법은 차례로 되돌아오는 값을 고려하지 않고 진행된다는 것이다.다시 말하면obj 대상의 모든 속성은 fn 방법에 의해 호출됩니다. 설령 fn 함수가false로 되돌아온다 하더라도.호출된 매개 변수는 1과 유사합니다.
이상은 본문의 전체 내용입니다. 여러분의 학습에 도움이 되고 저희를 많이 응원해 주십시오.

좋은 웹페이지 즐겨찾기