IT

부모 순수 자바 펼쳐의 하위 요소 찾기

lottoking 2020. 8. 7. 07:46
반응형

부모 순수 자바 펼쳐의 하위 요소 찾기


가장 쉬운 방법은 순수한 자바 펼쳐 만 사용하여 특정 부모 요소의 하위 요소 (클래스 또는 ID 포함)를 찾는 것입니다. jQuery 나 다른 프레임 워크가 없습니다.

이 경우, 나는 필요가 마이너스 1 또는 마이너스 2부모를 DOM 트리가 번거 로움 수있는 가정, 마이너스 1 또는 2 트리에서 요소를. 부모 의 요소 만 원합니다

<div class="parent">
    <div class="child1">
        <div class="child2">
        </div>
    </div>
</div>

children속성은 다음과 같이 요소 배열을 반환합니다.

parent = document.querySelector('.parent');
children = parent.children; // [<div class="child1">]

이 원한다면 당신 querySelector처럼 대안이 있습니다 document.getElementsByClassName('parent')[0].


편집 : 그것에 대해 생각 이제 querySelectorAll하기 때문에 parent클래스 이름이 child1다음 과 같은 사용 됩니다 .

children = document.querySelectorAll('.parent .child1');

qS와 qSA의 차이점은 후자가 선택기와 일치하는 모든 요소를 반환 하지만 전자는 첫 번째 요소 만 반환하는 것입니다.


이미 가지고있는 권한 var parent = document.querySelector('.parent');검색 범위를 parent어린이의 범위로 수 있습니다 .

parent.querySelector('.child')

더 선택기를 사용하여 구현하는 어린이를 얻을 수있는 다른 아이디어를 추가하기 만하면됩니다.

document.querySelectorAll(".parent > .child1");

클래스 .child1을 가진 모든 직계 가족을 반환해야합니다.

참고 URL : https://stackoverflow.com/questions/16302045/finding-child-element-of-parent-pure-javascript

반응형