getElementsByClassName 원리

getElementsByClassName의 원리

간단하다. MDN에서 기본 개념을 한번 보고 정리를 해보자.

결론은 클래스 이름을 가져온다.

그러면 어디서 가져올까?

HTML이니깐 DOM에서 가져오겠지.

document의 자식노드인 body를 찾으면 되고, body의 하위태그인 classList, childNodes를 찾으면된다.

정리하면,

1) body안에 있는 요소들 중에 className이 있는지 확인.

2) 있다면 classList에 클래스 네임과 일치하는지 확인. 일치하면 새로운 배열에 담는다.

3) 일치하는 배열중에 childNodes 존재하는지 확인 후 classList에 이름있는지 확인한다.

4) 있으면 새로운 배열에 담는다.

5) 배열을 반환한다.

기본 로직은 이렇다.