더북(TheBook)

텍스트와 태그 변경하기

이번에는 textContent 속성으로 태그 내부의 텍스트를 수정해 보겠습니다. textContent에 값을 넣으면 해당 태그의 값으로 화면에 설정됩니다.

형식

태그.textContent = 값; // 태그 내부의 문자열을 해당 값으로 설정함

$order.textContent = 2;를 하면 #order 변수에 담긴 태그 내부의 값이 ‘2’로 설정됩니다.

<script>
const $order = document.querySelector('#order');
$order.textContent = 2; 
console.log(typeof $order.textContent);
</script>

숫자 2를 textContent에 대입했지만, textContent는 문자열만 취급하므로 자동으로 문자열 2로 형 변환되어 값이 반영됩니다. typeof를 사용해 자료형을 확인할 수 있습니다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.