jQuery 알아보기 : 탐색 선택자

jQuery 탐색 선택자 알아보기

jQuery 탐색 선택자

분류	선택자 종류	설명		예제
기본 탐색 선택자	children()	$("div").children()	div 요소의 자식 요소를 선택합니다.	보러 가기
	parent()	$("p").parent()	p 요소의 부모 요소를 선택합니다.
	parents()	$("p").parents("div")	p 요소의 부모 요소가 되는 모든 div 요소를 선택합니다.
	closest()	$("p").closest("div")	p 요소의 부모 요소가 되는 첫 번째 div 요소를 찾습니다.
	next()	$("div.m").next()	div.m 요소의 다음 요소를 선택합니다.
	nextAll()	$("div.m").nextAll()	div.m 요소의 다음 요소들을 모두 선택합니다.
	nextUntil()	$("div.m").nextUntil("p")	div.m 요소의 다음 요소부터 p요소 전까지의 요소를 선택합니다.
	prev()	$("div.m").prev()	div.m 요소의 이전 요소를 선택합니다.
	prevAll()	$("div.m").prevAll()	div.m 요소의 이전 요소들을 모두 선택합니다.
	prevUntil()	$("div.m").prevUntil("p")	div.m 요소의 이전 요소부터 p요소 다음 요소까지를 선택합니다.
	siblings()	$("div").siblings("p")	div 요소의 형제 요소 중 p 요소를 선택합니다.
	find()	$("div").find("span")	div 요소의 하위 요소 중 span 요소를 선택합니다.
	filter()	$("div").filter(".m")	div 요소 중 class가 "m"인 요소를 선택합니다.
	not()	$("div").not(".m")	div 요소 중 class가 "m"이 아닌 요소를 선택합니다.
	has()	$("div").has("span")	div 요소 중 span 요소를 포함하고 있는 요소를 선택합니다.
	eq()	$("div").eq(0)	div 요소 중 index가 0 요소들을 선택합니다. index 0번은 첫 번째 요소입니다.
	gt()	$("div").gt(0)	index가 0보다 큰 요소들을 선택합니다.
	lt()	$("div").lt(3)	index가 3보다 작은 div 요소들을 선택합니다.
기타 탐색 선택자	add()	$("div").add()	span 요소 중 class가 'abc'인 요소를 선택합니다.	보러 가기
	addBack()	$("div").children("p").addBack()	p 요소의 이전 선택요소 div를 선택합니다.
	end()	$("div").find("span").css(...).end().find("em").css(...)	$("div").find("span").css(...)의 실행이 끝나면 처음 선택자 $("div")로 다시 돌아와 $("div").find("em").css(...)가 실행됩니다.
	is()	if(("div").children().is("p")){     console.log("p 요소가 맞습니다."); }	선택한 요소를 판별해주는 선택자로 보통 if문의 조건식에 사용됩니다.

jQuery 공식 사이트
방문하기