querySelector 메서드

querySelector 메서드는 CSS 선택자를 사용하여 페이지 요소를 가져올 수 있게 해줍니다. 가져온 요소로는 다양한 작업을 수행할 수 있습니다: 텍스트 변경, 속성 변경, CSS 스타일 변경 등.

문법

javascriptdocument.querySelector(선택자);

예제

#elem 문단을 가져와서 textContent를 사용하여 텍스트를 변경해 봅시다:

html<p id="elem">text</p>

javascriptlet elem = document.querySelector('#elem');
elem.textContent = '!!!';

코드 실행 결과:

html<p id="elem">!!!</p>

예제

elem 클래스를 가진 문단을 가져와서 텍스트를 변경해 봅시다:

html<p class="elem">text</p>

javascriptlet elem = document.querySelector('.elem');
elem.textContent = '!!!';

코드 실행 결과:

html<p id="elem">!!!</p>

참고 항목