[javascript] DOM 요소 찾기

JavaScript를 사용하여 웹 페이지의 DOM(Document Object Model) 요소를 찾는 방법에 대해 알아보겠습니다.

getElementById를 사용한 요소 찾기

const element = document.getElementById('elementId');

위 코드에서 elementId는 원하는 요소의 ID입니다. 이 메소드는 페이지 내에서 해당 ID를 가진 요소를 찾아 반환합니다.

querySelector를 사용한 요소 찾기

const element = document.querySelector('.elementClass');

위 코드에서 .elementClass는 원하는 요소의 클래스명이며, querySelector는 CSS 선택자를 사용하여 요소를 찾습니다. class명이 elementClass인 첫 번째 요소를 반환합니다.

querySelectorAll을 사용한 여러 요소 찾기

const elements = document.querySelectorAll('p');

위 코드는 모든 <p> 요소를 반환합니다. querySelectorAll은 CSS 선택자와 일치하는 모든 요소를 반환합니다.

JavaScript를 사용하여 DOM 요소를 찾는 방법에 대해 알아보았습니다. 이를 통해 웹 페이지의 요소들을 동적으로 제어할 수 있게 됩니다.

더 자세한 내용은 MDN web docs를 참고하세요.