jQuery.each() > 개발자팁

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!

개발자팁

개발과 관련된 유용한 정보를 공유하세요.
질문은 QA에서 해주시기 바랍니다.

jQuery.each() 정보

jQuery jQuery.each()

본문

jQuery.each()

설명 : 객체와 배열을 반복적으로 반복하는 데 사용할 수있는 일반 반복기 함수입니다. length 속성을 가진 배열 및 배열과 유사한 객체 (함수의 arguments 객체 등)는 0에서 length-1 사이의 숫자 인덱스에 의해 반복됩니다. 다른 객체는 명명 된 속성을 통해 반복됩니다.

이 $.each()함수는 $ (selector) .each () 와 같지 않습니다 . jQuery 객체를 독점적으로 반복하는 데 사용됩니다. 이 $.each()함수는 객체인지 배열인지에 상관없이 모든 컬렉션을 반복하는 데 사용할 수 있습니다. 배열의 경우 콜백은 매번 배열 인덱스와 해당 배열 값을 전달받습니다. 값은 this키워드를 통해 액세스 할 수도 있지만 자바 스크립트는 단순한 문자열이나 숫자 값이더라도 항상 this값을 줄 바꿈합니다 Object. 메서드는 첫 번째 인수 인 반복 된 객체를 반환합니다.

참고 : 이 $.each()함수 length는 전달 된 컬렉션 의 속성을 내부적으로 검색하여 사용합니다 . 따라서 콜렉션에 length- 예 {bar: 'foo', length: 10}- 라는 속성이 있으면 함수가 예상대로 작동하지 않을 수 있습니다.

$.each([ 52, 97 ], function( index, value ) {
  alert( index + ": " + value );
});

이렇게하면 두 가지 메시지가 생성됩니다.

0 : 52 
1 : 97

객체가 컬렉션으로 사용되면 콜백은 매번 키 - 값 쌍을 전달합니다.

var obj = {
  "flammable": "inflammable",
  "duh": "no duh"
};
$.each( obj, function( key, value ) {
  alert( key + ": " + value );
});
다시 한번, 이것은 두 개의 메시지를 생성합니다 :

인화성 : 인화성 
duh : 아니야.

우리는 $.each()콜백 함수를 반환함으로써 특정 반복에서 루프를 깨뜨릴 수 있습니다 false. false 가 아닌 값을 반환 continue하면 for 루프 의 명령문 과 동일 합니다. 즉시 다음 반복으로 건너 뜁니다.

예 :
각 숫자를 단어와 숫자로 표시하는 배열을 반복합니다.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>jQuery.each demo</title>
  <style>
  div {
    color: blue;
  }
  div#five {
    color: red;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
<div id="four"></div>
<div id="five"></div>
 
<script>
var arr = [ "one", "two", "three", "four", "five" ];
var obj = { one: 1, two: 2, three: 3, four: 4, five: 5 };
 
jQuery.each( arr, function( i, val ) {
  $( "#" + val ).text( "Mine is " + val + "." );
 
  // Will stop running after "three"
  return ( val !== "three" );
});
 
jQuery.each( obj, function( i, val ) {
  $( "#" + i ).append( document.createTextNode( " - " + val ) );
});
</script>
 
</body>
</html>

추천
0

댓글 0개

전체 571
개발자팁 내용 검색 jQuery에서

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT