HTML DOM Element innerText 속성

정의 및 사용법

innerText 속성을 설정하거나 반환하여 요소의 텍스트 내용을 정의하거나 반환합니다.

주의사항：설정 innerText 속성을 설정할 때, 모든 자식 노드가 제거되고 하나의 새로운 텍스트 노드로 대체됩니다.

추가로 참조하십시오：

textContent 속성

innerHTML 속성

예제

요소의 내부 텍스트를 가져옵니다:

let text = element.innerText;

직접 시도해 보세요

문법

요소나 노드의 텍스트 내용을 반환합니다:

요소.innerText

또는

노드.innerText

요소나 노드의 텍스트 내용을 설정합니다:

요소.innerText = text

또는

노드.innerText = text

속성 값

값 설명
text 요소의 텍스트 내용

반환 값

타입 설명
문자열 요소와 모든 자식의 텍스트 내용, <script>과 <style> 요소를 제외합니다.

innerHTML, innerText과 textContent의 차이

innerText 속성이 반환합니다:

CSS 숨겨진 텍스트 간격과 태그를 제외하고, 요소와 모든 자식의 텍스트 내용만 반환합니다. <script>과 <style> 요소는 제외됩니다.

innerHTML 속성이 반환합니다:

요소의 텍스트 내용, 모든 공백과 내부 HTML 태그를 포함합니다.

textContent 속성이 반환합니다:

요소와 모든 자식의 텍스트 내용, 공백과 CSS 숨겨진 텍스트를 포함하지만, 태그는 없습니다.

HTML 예제

<p id="myP">   이 요소는 추가 공백이 있으며 <span>span 요소</span>를 포함하고 있습니다.</p>

JavaScript 예제

let text = document.getElementById("myP").innerText;
let text = document.getElementById("myP").innerHTML;
let text = document.getElementById("demo").textContent;

직접 시도해 보세요

위의 예제에서:

innerText 속성이 반환합니다:

이 요소는 추가 공백이 있으며 span 요소를 포함하고 있습니다.

innerHTML 속성이 반환합니다:

   이 요소는 추가 공백이 있으며 <span>span 요소</span>를 포함하고 있습니다.

textContent 속성이 반환합니다:

   이 요소는 추가 공백이 있으며 span 요소를 포함하고 있습니다.

浏览器支持

所有浏览器都支持 element.innerText：

Chrome IE Edge Firefox 사파리 오퍼라
Chrome IE Edge Firefox 사파리 오퍼라
지원 10-11 지원 지원 지원 지원