jQuery 2 Divs Up을 선택하십시오

Question

나는 부모 항목을 올바르게 선택하는 방법에 대해 다소 혼란 스럽습니다. 즉 2 DIV입니다. 즉

, 내 HTML은 다음과 같습니다 $("a[href$='.jpg']").addClass("Image");

그러나, 내가 대신 내가 원하는의 <a>에 클래스를 추가하지 않으 :

<div>Folder</div> 
<div class="file_info"> 
    <a href="test.jpg">Test File</a> 
</div> 

여기 내 현재 jQuery의 위의 '폴더'2 DIV에 클래스를 추가하십시오.

이 작업을 수행하는 가장 좋은 방법은 무엇입니까?

감사합니다.

Answer 1

이 작동합니다 :

$("a[href$='.jpg']").parent().prev().addClass("Image"); 

첫째 따라서 당신이 필요로하는 div 요소에 도달, 선택한 요소의 부모 요소로 이동 한 후 해당 요소 전에 가장 가까운 형제에.

자세한 내용은 parent 및 prev 설명서를 참조하십시오.

Answer 2

$("a[href$='.jpg']").parent().parent().addClass('Image'); 

Answer 3

당신이해야 할 일을 하나 이상의 방법 거의 항상있다, jQuery의 견고 함을 감안할 때 - 여기 할아버지 요소 선택하기위한 몇 가지 방법이 있습니다 :

$("a").parent().parent(); 

이는 소리가 정확히 무엇을 like - 앵커의 부모 부모를 선택합니다. 부모은 대상 요소를 바로 둘러싼 요소입니다. 이 경우 두 번 모두 div 요소입니다. 이 예에서

$("a").parents("div:eq(1)"); 

, 우리는 복수 부모을 사용하고있는 것을 알 수 있습니다. 이렇게하면 요소의 모든 부모를 조회 한 다음 컬렉션으로 반환합니다. 그런 다음 학부모 중 어떤 것이 특정 선택을 제공하여 컬렉션에 반환하고 싶은지 지정합니다 : div:eq(1).

이 결과는 div 개의 요소가 필요하지만 결과 집합의 위치 2에있는 요소는 div입니다. 정의에 따르면 위치 2는 하나의 요소 만 포함 할 수 있으므로 하나의 요소, 즉 할아버지 요소 만 반환합니다.

이 동일 div 것을 (:eq) 1를 요구하면서이 날이 "위치 2"를 호출하여 혼동하는 경우, 단지 자바 스크립트 컬렉션의 제로 기반 색인 시스템, 그래서 첫 번째 항목을 사용하는 기억 인덱스 0에 있고, 두 번째 인덱스 1에 있습니다.

$("a").parents("div").get(1); 

또 다른 예는 .get을 사용하는 마지막 예와 유사합니다. 또한 .parents 메서드를 사용하여 div 요소를 모두 호출해야합니다. 이렇게하면 div 요소로 가득 찬 jQuery 객체가 반환됩니다 (부모 트리가 div 요소로 가득하다고 가정).

.get 메서드는 검색 할 요소에 해당하는 인덱스를 사용합니다. 이 경우 두 번째 div 요소를 찾고 다시 .parents을 호출 한 결과 컬렉션의 인덱스 1에서 유지됩니다.

주목해야 할 중요한 점 중 하나는 jQuery 객체가 아닌이 예제가 이전 예제와 달리 실제 HTMLDivElement을 반환한다는 것입니다. 차이점은 $()으로 다시 포장하지 않는 한 jQuery 메서드를 HTMLDivElement에서 호출 할 수 없다는 것입니다.