[jQuery]확장 집합(확장 엘리먼트)에서 엘리먼트 선택하기

보통은 확장된 엘리먼트의 집합을 얻어 jQuery커맨드를 사용해 일련의 작업을 수행할 수 있다.

예를 들자면 hide() 메서드로 모두 감출 수 있는 경우다.

그러나 확장된 엘리먼트를 참조하여 특정 엘리먼트에만 연산을 수행하고자 할 때도 있다.

jQuery 확장 엘리먼트는 자바스크립트 배열과 유사하기 때문에 확장 리스트의 어떤 엘리먼트를 얻더라도

단순한 배열 인텍스를 사용 할 수 있다.

$('selector').[index] 처럼 사용하면 된다.

index는 0부터 시작한다.

jQuery의 함수를 사용하고 싶으면 get(index)를 사용하면 된다.

Colored By Color Scripter™

1 2 3 4 5 6 7 8 9 10

get: function( num ) {        return num != null ?            // Return just the one element from the set            ( num < 0 ? this[ num + this.length ] : this[ num ] ) :            // Return all the elements in a clean array            slice.call( this );    }

실제 jQuery 소스를 보면 이해 할 수 있겠지만 num이 null인 경우는 확장 엘리먼트 전체를 반환하는 것을 확인 할 수 있을 것이다.

이와 반대로 확장 엘리먼트에서 특정 엘리먼트를 찾고 싶을 경우도 있다.

index(element)를 이용하면 된다.

element는 순서 번호를 알고자 하는 엘리먼트의 selector이다.

Colored By Color Scripter™

1 2 3 4 5 6 7 8 9 10

index: function( obj ) {        var pos = -1;        this.each(function(i){            if ( this == obj ) pos = i;        });        return pos;    } // 예제 var n = $('img').index($('img#findMe')[0]);

아래의 예제 처럼 사용하면 된다.