DIV 내에서 클래스가있는 아이템을 어떻게 선택할 수 있습니까?

142

다음 HTML이 있습니다.

<div id="mydiv">
  <div class="myclass"></div>
</div>

inside를 선택 div하지만 mydiv컨테이너에 맞는 선택기를 사용할 수 있기를 원합니다 . jQuery로 어떻게 이것을 달성 할 수 있습니까?

— 이단 셰터
소스

285

시험:

$('#mydiv').find('.myclass');

JS 피들 데모 .

또는:

$('.myclass','#mydiv');

JS 피들 데모 .

또는:

$('#mydiv .myclass');

JS 피들 데모 .

참고 문헌 :

find().
선택기 상황 .

find()설명서 에서 배우는 것이 좋습니다 .

.find () 및 .children () 메소드는 후자가 DOM 트리 아래로 단일 레벨 만 이동한다는 점을 제외하면 비슷합니다.

— 데이비드는 모니카의 복직을 말한다
소스

2

두 번째 두 가지는 작동하지 않지만 찾기는 괜찮습니다. 두 번째 두 가지는 모든 class = myclass를 선택하고 모든 id = mydiv를 선택합니다)).

— czupe

2

@czupe : 아니요, 컨텍스트 선택기 접근 방식은 다르게 작성되지만 jQuery는 내부적으로 $('#mydiv').find('.myclass');첫 번째 코드 조각에서 사용 된 것과 동일한 접근 방식을 구현 합니다. 덧붙여서 : '... select every id=mydiv'? 단지이 있어야 이제까지 주어진 중 하나 개를 사용 할 id페이지에이 (AN은 id 해야한다 문서 내에서 고유 ).

— 데이비드는 모니카 복원

@DavidThomas 글쎄, 방금 $ ( '# mydiv .myclass'); 결국 mydiv 내의 div가 아닌 myclass 클래스를 가진 모든 div를 선택하게되었습니다.

— user3281466

@ user3281466 : 정말로 요? 그럴 것 같지 않습니다. 문제 를 재현 할 수 있습니까?

— 데이비드는 모니카

div에서 무엇을 확인한 다음 : not ()에 넣는 방법

— SuperUberDuper

20

이 시도

$("#mydiv div.myclass")

— 샨 카르
소스

또는 그것이 div(또는 항상이면) 상관하지 않는다면 div$ ( "# mydiv .myclass")로 단순화 할 수 있습니다.

— Michael Mior

@Michael-예. .mycalss라고 말할 수 있지만 div를 알고 있으면 div.myclass가 검색 속도를 높여줍니다.

— ShankarSangoli

@Shankar, 아마도 더 빠르지 않을 것입니다. jquery가 네이티브가 아닌 sizzle을 사용한다고 가정하면 document.queryselectorall동일한 방식으로 검색하고 추가 검사를 수행합니다 . 기본 구현이 동일하게 수행 될 수 있습니다.

— davin

내가 실행 한 몇 가지 빠른 테스트는 이것이 브라우저에 따라 다르다는 것을 나타냅니다. Chrome에서는 조금 더 빨랐고 FF에서는 조금 느 렸습니다. 어느 쪽이든,이 선택기를 여러 번 실행하거나 많은 수의 요소를 실행하지 않는 한 그 차이는 무시할 수 있습니다. 내 조잡한 (그리고 아마도 결함이있는) 테스트에 대해서는 여기 를 참조 하십시오 .

— Michael Mior

@Michael-클래스 이름과 함께 태그 이름을 지정하면 먼저 getElementsByTagName을 사용하고 iw가 확실하게 더 빠르며 기본 메소드를 사용하여 첫 번째 레벨 정렬을 수행하는 클래스 이름을 찾습니다. 선택해야 할 요소가 많지 않으면 무시할 수 있습니다.

— ShankarSangoli

11

CSS 선택기를 적용하는 것과 같은 방식으로 수행합니다. instanse의 경우 할 수있는 일

$("#mydiv > .myclass")

또는

$("#mydiv .myclass")

마지막 클래스는 myclass 내의 myclass를 포함하여 myDiv 내의 모든 myclass와 일치합니다.

— 레안드로 갈 럽피
소스

6

클래스 속성이 "myclass"인 모든 요소를 선택하려면

$('#mydiv .myclass');

"myclass"클래스 속성을 가진 div 요소 만 선택하려면 다음을 사용하십시오.

$("div#mydiv div.myclass");

jquery selectors에 대한 자세한 내용은 다음 기사를 참조하십시오.

— e11438
소스

1

대신 이것을 시도하십시오 $(".video-divs.focused"). 초점이 맞춰진 비디오 div를 찾고있는 경우 작동합니다.

— 사용자 3749775
소스