[Javascript] 자식 요소(element) 개수 확인하기 - childElementCount

 

childElementCount

DOM에서

Javascript를 이용하여

자식 요소(element)의 개수를 확인하기 위해서

Element의 childElementCount 속성을 사용할 수 있습니다.

 

ParentNode.childElementCount

 

childElementCount는

요소의 자식 요소(child element) 개수를 리턴합니다.

  (단, 이 속성은 IE9 이전 버전에서는 지원하지 않습니다.)  

 

  예제  

<ul id='parent'>
  <li>바나나</li>
  <li>사과</li>
</ul>

<div> ======== 결과 ======== </div>

// parent element 선택
const parent = document.getElementById('parent');

// childElementCount 값 찍기
document.write(parent.childElementCount); // 2

 

 

parent.childElementCount;

위 예제는 parent라는 id를 갖는 <ul> 요소의 자식의 개수를 구하는 예제입니다.

<ul>의 하위에는 2개의 <li> 요소가 있으므로,

예제에서는 2가 출력되었습니다.

 

---

 

childElementCount를 활용하여

자식요소의 개수를 구하는 방법을 알아보았습니다.