jQuery에서 알려진 클래스를 가진 부모를 찾는 방법은 무엇입니까?


244

나는 <div><div>안에 다른 중첩 레벨에 많은 다른 것들이 있습니다. 모든 어린이 <div>에게 식별자를 부여하는 대신 루트 <div>에 식별자를 부여합니다 . 예를 들면 다음과 같습니다.

<div class="a" id="a5">
  <div class="b">
    <div class="c">
      <a class="d">
      </a>
    </div>
  </div>
</div>

jQuery에서 클래스에 응답하는 함수를 작성 d하고 부모 클래스의 ID를 찾으려면 a어떻게해야합니까?

$('.a').attr('id');여러 클래스가 있기 때문에 간단하게 할 수 없습니다 a. 부모의 부모의 ID를 찾을 수는 있지만 디자인이 느리고 느리고 매우 다형성이 아닌 것 같습니다 (클래스의 ID를 찾기 위해 다른 코드를 작성해야합니다 c).

답변:


490

즉 가정 this입니다 .d, 당신은 쓸 수 있습니다

$(this).closest('.a');

closest메소드 는 선택기와 일치하는 요소의 가장 안쪽 부모를 반환합니다.


47
캐치가 거의 없다는 점에 유의하십시오. 시작 요소가 쿼리와도 일치하면 부모 요소는 아니지만 동일한 요소를 가져옵니다. 이것은 원하는 행동 일 수도 있고 아닐 수도 있습니다. 그렇지 않다면 이것을 추천합니다 : $ (this) .parent (). closest ( '. a');
Risord

1
매우 도움이됩니다. 나는 항상 $ (this) .parent (). parent (). parent ()을 사용하고 더 나은 해결책이 있다는 것을 알았습니다.
Wang'l Pakhrin

28

선택기를 jQuery 부모 함수에 전달하십시오.

d.parents('.a').attr('id')

편집 흠, 실제로 Slaks의 대답은 선택자와 일치하는 가장 가까운 조상 만 원한다면 우수합니다.


8

부모 () 를 사용 하여 주어진 선택기를 가진 모든 부모를 얻을 수 있습니다 .

설명 : 현재 일치하는 요소 집합에서 각 요소의 조상을 가져오고 선택적으로 선택기로 필터링합니다.

그러나 parent () 는 요소의 첫 번째 부모 만 가져옵니다.

설명 : 현재 일치하는 요소 집합에서 각 요소의 부모를 가져오고 선택적으로 선택기로 필터링합니다.

jQuery parent () 대 부모 ()

그리고 내가 최고라고 생각하는 .parentsUntil () 이 있습니다.

설명 : 현재 일치하는 요소 집합에서 각 요소의 조상을 가져옵니다 (선택자가 일치하는 요소는 포함하지 않음).


그는 한 명의 부모 만 원하므로을 호출해야합니다 closest.
SLaks

2

.parentsUntil () 사용

$(".d").parentsUntil(".a");

일치하는 상위 요소에 도달 할 때까지 모든 상위 요소를 대상으로합니다.
Dustin Halstead

0

위의 @Resord의 의견에서 추출되었습니다. 이것은 나를 위해 일했고 질문에 더 가깝습니다.

$(this).parent().closest('.a');

감사

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.