Ancestors
jQuery를 사용하면 DOM 트리를 탐색하여 요소의 조상을 찾을 수 있다.
조상은 부모, 조부모, 증조부모 등이다.
DOM 트리 탐색
DOM 트리를 탐색하는 데 유용한 세 가지 jQuery 메서드는 다음과 같다.
- parent()
- parents()
- parentsUntil()
jQuery parent()
parent() 메서드는 선택한 요소의 직접 상위 요소를 반환한다.
이 방법은 DOM 트리에서 한 수준 위로만 이동한다.
예제
$(document).ready(function(){ $("span").parent(); });
기본 예시
예제 보기jQuery parents()
parents() 메서드는 선택한 요소의 모든 상위 요소를 문서의 루트 요소()까지 반환한다.
예제 1
$(document).ready(function(){ $("span").parents(); });
기본 예시
예제 보기예제 2
$(document).ready(function(){ $("span").parents("ul"); });
기본 예시
예제 보기jQuery parentUntil()
parentsUntil() 메서드는 지정된 두 인수 사이의 모든 상위 요소를 반환한다.
예제
$(document).ready(function(){ $("span").parentsUntil("div"); });
기본 예시
예제 보기참고
W3C School - jQuery Traversing - Ancestors
jQuery 시작하기