jQuery 부모() 메서드
예시
<span>의 모든 상위 요소를 반환합니다.
$(document).ready(function(){
$("span").parents().css({"color": "red", "border": "2px solid red"});
});
결과:
body (great-great-grandparent)
div (great-grandparent)
ul (grandparent)
- li (direct parent)
span
정의 및 사용
parent() 메서드는 선택한 요소의 모든 상위 요소를 반환합니다.
조상은 부모, 조부모, 증조부모 등입니다.
DOM 트리: 이 메서드는 상위 요소에서 DOM 요소의 조상을 따라 문서의 루트 요소(<html>)까지 위쪽으로 트래버스합니다.
참고: 필터 매개변수가 비어 있으면 이 함수는 직접 부모부터 <body> 및 <html>까지 요소 집합의 모든 상위 항목을 선택합니다. 따라서 검색 결과의 범위를 좁히기 위해 선택기 표현식을 전달하는 것이 종종 유용합니다.
이 메소드는 모두 DOM 트리를 탐색한다는 점에서 가장 가까운() 과 유사합니다. 차이점은 다음과 같습니다.
부모()
- 상위 요소로 시작
- DOM 트리 위로 이동하고 전달된 표현식과 일치하는 모든 조상을 반환합니다.
- 반환된 jQuery 개체에 0개 이상의 요소가 포함되어 있습니다.
가장 가까운()
- 현재 요소로 시작
- DOM 트리 위로 이동하고 전달된 표현식과 일치하는 첫 번째 조상을 반환합니다.
- 반환된 jQuery 객체에는 0개 또는 1개의 요소가 포함되어 있습니다.
기타 관련 방법:
- parent() - 선택한 요소의 직접적인 부모 요소를 반환합니다.
- parentUntil() - 주어진 두 인수 사이의 모든 상위 요소를 반환합니다.
통사론
$(selector).parents(filter)
| Parameter | Description |
|---|---|
| filter | Optional. Specifies a selector expression to narrow down the search for ancestors Note: To return multiple ancestors, separate each expression with a comma. |
직접 해보십시오 - 예
필터 매개변수를 사용하여 <ul> 요소인 <span>의 모든 조상을 반환하는 방법.
필터 매개변수를 사용하여 <li> 및 <div> 요소인 <span>의 모든 조상을 반환하는 방법.
<span> 요소의 조상이 실제로 누구인지 보여주는 데모.