jQuery select ancestor

Question

jQuery를 사용하여 요소의 조상을 선택할 수 있습니까?

마크 업 :

<div id="ancestor-1"> 
    <div> 
     <a href="#" class="click-me">Click me</a> 
    </div> 
</div> 
<div id="ancestor-2"> 
    <div> 
     <a href="#" class="click-me">Click me</a> 
    </div> 
</div> 

스크립트 :

$(".click-me").click(function(){ 
    // var ancestorId = ???; 
    alert(ancestorId) 
}); 

Answer 1

당신이 parent()을 찾고 계십니까? 상위 선택 자의 경우 jQuery Doc 시나리오에 따라 다를 경우 기대되는 결과가 무엇인지 설명하십시오.

Answer 2

이런 뜻입니까? 일치하는 항목이 발견 될 때까지

$('.click-me').click(function() { 
    var $theAncestor = $(this).closest('#ancestor-1'); 
} 

이 모든 조상을 검색합니다.

http://api.jquery.com/closest/

편집 :

제롬, 질문은 여러 가지 방법으로 해석 될 수있다. 이것은 jQuery의 강력 함과 유연성을 말해줍니다.

다음 사항을 고려하십시오.

먼저 질문에 대답하기 위해 jQuery를 사용하여 요소의 조상을 선택할 수 있습니다.

는 우리가 당신이 모든 요소를 ​​선택 jQuery의 능력을 알고 있다고 가정 할 수 있다고 생각을 통해 조상 또는 후손 여부 : 당신이 세트를하고 싶은 경우 클릭 나 예를 감안할 때

$('#myElement') 

요소의 조상의 모든 사용, 반환

$(this).parents() 

또는

$(this).parents(selector) 

그러나 이것은 모든 조상이 모두를 반환하거나 선택자가 주어질 때 일치하는 모든 것을 통과한다는 것을 명심하십시오. 당신이 조상 알고 경우, 사용이 필요

$(this).parent() 

:

$(this).closest(selector) 

을하지만 그것은 단지를 반환된다는 점에 유의

당신이 바로 위 부모를하고 싶은 경우

사용, 반환 첫 번째 일치, 현재 요소 (this)가 일치하면 반환합니다.

이 정보가 도움이되기를 바랍니다.

Answer 3

바로 가기 요소에 대해 parent()을 시도하십시오. 일치하는 모든 조상 요소에 대한

$(".click-me").click(function() { 
    var ancestor = $(this).parent(); 
    alert(ancestor) 
}); 

또는 parents()

.제 가까운 매칭 소자 (상위 또는 자체)에 맞는

$(".click-me").click(function() { 
    var ancestors = $(this).parents(".some-ancestor"); 
    alert(ancestors) 
}); 

또는 closest().

$(".click-me").click(function() { 
    var ancestor = $(this).closest(".some-ancestor"); 
    alert(ancestor) 
}); 

parents()closest()과의 차이는 미묘하지만 중요하다. closest()은 일치하는 경우 현재 요소를 반환합니다. parents()은 조상 만을 반환합니다. 현재 요소를 반환 할 가능성을 원치 않는 경우가 많습니다. closest()은 또한 하나의 요소 만 반환합니다. parents()은 일치하는 요소를 모두 반환합니다.

Answer 4

http://api.jquery.com/parent/ 및

$(".click-me").click(function(){ 
    var ancestorId = $(this).parent().parent(); 
    alert(ancestorId) 
}); 

http://api.jquery.com/parents/은 조상이 일치해야하는 결정하기 위해 선택과 함께, 아마도, 함께 부모() 또는()에 가장 가까운을 사용하여보십시오 IDS

Answer 5

로 된 div를 반환합니다. 예를 들어, id가있는 가장 가까운 조상 div를 찾으십시오.

$('.click-me').click(function() { 
     var ancestorId = $(this).closest('div[id]'); 
     alert(ancestorId); 
}); 

Answer 6

실제로 달성하고자하는 것에 달려 있습니다. 사용 된 클래스에 관계없이 모든 조상을 검색 하시겠습니까? 또는 조상 인 모든 요소를 ​​검색하고 특정 클래스 (조상 -x)를 찾고 싶습니까? 아마 가장 좋은 방법은하는 것

$(".click-me").click(function(){ 
    var parentElements = $(this).parents().map(function() { 
     return this.tagName; 
    }) 
    // whatever else you want to do with it 
}); 

: 당신이 어떤 조상을 순환하려면

, 단순히 .parent() 당신처럼 사용하거나 .parents() (어떻게 모든 요소를 ​​순환 훌륭한 예있다)를 사용 특정 ID 또는 클래스가있는 요소가 나타날 때까지 .parents()을 사용하십시오. 그것은 정말로 당신이하고 싶은 것에 달려 있습니다.