더북(TheBook)

텍스트와 태그 가져오기

‘1번째 참가자’라는 문자열에서 현재 참가자가 몇 번째 참가자인지 확인하기 위해 1을 가져와야 한다고 합시다. 이럴 때는 문자열이 담긴 태그에 textContent라는 속성을 붙이면 됩니다.

형식

태그.textContent // 태그 내부의 문자열을 가져옴

예제에서 span 태그 내부에 있는 1을 가져와 보겠습니다. 추가로 첫 번째 div 태그의 textContent 값도 가져오겠습니다.

<div><span id="order">1</span>번째 참가자</div>
<div>제시어: <span id="word"></span></div>
<input type="text">
<button>입력</button>
<script>
const $order = document.querySelector('#order');
console.log($order.textContent);
const $div = document.querySelector('div');
console.log($div.textContent);
</script>
신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.