🏃getElementById vs querySelector🚶

공부하다가 느꼈다. 이 둘의 차이를...

코딩 테스트를 풀이 하면서 여러가지 글을 읽게 되었는데
getElementbyId()와 querySelector()간의 차이점에 대해 알아야 겠다고 생각을 했다.

우선 이 둘은 무엇인지에 대해 알아보자

<div id="something">
  <div id="some" class="someClass">
    <span>hihi</span>
  </div>
</div>

이와 같은 코드가 있을 때, id가 some인 태그의 span에 접근 하려고 한다면,

//getElementById

document.getElementById('some').childNodes;

//querySelector

document.querySelector('#some span');

알 수 있는것은 getElementById보다 querySelector가 좀 더 구체적으로 요소를 선택할 수 있다.
그리고 querySelector는 인접한 태그들끼리의 상대적인 위치를 비교하여 가져올 수 있다.

처리 속도는 getElementById 가 더 빠르다고 한다.

getElementById 는 HTML콜렉션을 반환하고,
querySelector는 NodeList를 반환한다.

상황에 맞춰서 사용할 필요가 있다고 느낀다.