[jQuery 요약정리] 02. 찾은 노드 다루기

1. 찾은 노드의 개수 구하기.

$대상.length

* 문서에서 div태그 노드가 몇 개인지 출력

alert("div 태그 노드의 개수는 "+$("div").length);

2. 찾은 노드 중 n번째 노드 접근하기.

$대상.eq(index)

* ul.menu의 메뉴 노드(li) 중 두 번째 메뉴 노드의 border 속성을 “4px solid #f00”으로변경

$("ul.menu li").eq(1).css("border","4px solid #f00");

3. 자바스크립트 DOM 객체 접근하기.

$대상.get(index)

4. 순차적으로 찾은 노드 접근하기.

var $Listli = $("ul.menu li");

$Listli.each(function(index){

var borderpx = (index+1)*2;

$Listli.eq(index).css("border",borderpx+"px solid #f00");

})

var $Listli = $("ul.menu li");

$Listli.each(function(index){

var borderpx = (index+1)*2;

$(this).css("border",borderpx+"px solid #f00");

})

5. 찾은 노드 중에서 특정 노드만 찾기.

$대상.filter("선택자")

$liList.filter(".select").css("border","4px solid #f00");

6.찾은 노드의 자손 노드중 특정노드 찾기

*find() 메소드는 현재 노드가 아닌 현재 노드의 자식을 포함한 자손노드를 검색한다는 것!

$대상.find("선택자")

7. 인덱스 값 구하기

$대상.index()