jQuery 경우, 기본적으로 '확장집합' 형태의 Array (배열) 반환.
예외적으로, get() 메서드처럼 DOM element 반환하는 경우 有.
eq() vs. get() 예제
<script src="http://code.jquery.com/jquery-latest.js"></script>
<ul>
<li id='a'>A</li>
<li id='b'>B</li>
</ul>
<script>
// alert($("li").eq(0)); // [object Object]
// alert($("li").eq(0)[0]); // [object HTMLLIElement]
// alert($("li").get(0)); // [object HTMLLIElement]
// alert($("li")[0]); // [object HTMLLIElement]
// console.log($("li").eq(0)); // jQuery 객체 반환. jQuery로 조작. 아래 참고
// console.log($("li").eq(0)[0]); // DOM 반환. JS로 조작. 아래 참고
// console.log($("li").get(0)); // DOM 반환. JS로 조작. 아래 참고
// console.log($("li")[0]); // DOM 반환. JS로 조작. 아래 참고
$("li").eq(0).hide(); // 작동 O
// $("li").get(0).hide(); // 작동 X
</script>
결과보기
PS.
각 반환값 차이
console.log($("li").eq(0)); 경우, jQuery 확장집합 반환 . (∴ jQuery 다른 메서드와 함께 사용 O).
jQuery.fn.init [li#a, prevObject: jQuery.fn.init(2), context: document]
0: li#a
context: document
length: 1
prevObject: jQuery.fn.init(2) [li#a, li#b, prevObject: jQuery.fn.init(1), context: document, selector: "li"]
__proto__: Object(0)
console.log($("li").eq(0)[0]); 경우, DOM element 반환. (∴ jQuery 다른 메서드와 함께 사용 X).
<li id='a'>A</li>
console.log($("li").get(0)); 경우, DOM element 반환. (∴ jQuery 다른 메서드와 함께 사용 X).
<li id='a'>A</li>
console.log($("li")[0]); 경우, DOM element 반환. (∴ jQuery 다른 메서드와 함께 사용 X).
<li id='a'>A</li>
※ $("li").eq(0)[0] == $("li").get(0) == $("li")[0] : 셋 모두 DOM 요소 반환.
※ DOM 요소로 반환하는 경우, jQuery 메서드로는 조작 불가. (즉, JS로 조작함.)
