textContent 속성

textContent 속성을 사용하면 요소의 텍스트를 가져오고 변경할 수 있습니다.

구문

javascript요소.textContent;

예제

요소의 텍스트를 출력해 봅시다:

html<p id="elem">텍스트</p>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.textContent);

코드 실행 결과:

javascript'텍스트'

예제

요소의 텍스트를 변경해 봅시다:

html<p id="elem">텍스트</p>
javascriptlet elem = document.querySelector('#elem');
elem.textContent = '!!!';

코드 실행 결과:

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

예제

요소의 텍스트에 태그가 포함된 경우, 속성을 읽을 때 해당 태그는 출력되지 않습니다:

html<p id="elem"><b>텍스트</b></p>
javascriptlet elem = document.querySelector('#elem');
console.log(elem.textContent);

코드 실행 결과:

javascript'텍스트'

참고 항목

  • 요소의 HTML 코드를 포함하는 속성 innerHTML
  • 요소의 외부 HTML 코드를 포함하는 속성 outerHTML