querySelector 메서드
querySelector 메서드는
CSS 선택자를 사용하여 페이지 요소를
가져올 수 있게 해줍니다. 가져온 요소로는
다양한 작업을 수행할 수 있습니다: 텍스트 변경,
속성 변경, CSS 스타일 변경 등.
문법
document.querySelector(선택자);
예제
#elem 문단을 가져와서
textContent를 사용하여
텍스트를 변경해 봅시다:
<p id="elem">text</p>
let elem = document.querySelector('#elem');
elem.textContent = '!!!';
코드 실행 결과:
<p id="elem">!!!</p>
예제
elem 클래스를 가진 문단을 가져와서
텍스트를 변경해 봅시다:
<p class="elem">text</p>
let elem = document.querySelector('.elem');
elem.textContent = '!!!';
코드 실행 결과:
<p id="elem">!!!</p>
참고 항목
-
getElementById메서드,
id로 요소를 가져옵니다. -
querySelectorAll메서드,
선택자로 요소 그룹을 가져옵니다.