[DOM_Element] JS - innerText 속성 ★★ - 요소의 텍스트(문자열) 내용과 모든 하위 항목 설정/반환. (= innerText속성 = 이너텍스트 속성) (IE10 이상)

목차

1. innerText 예제 - 요소의 텍스트 내용 반환
2. innerText 예제 - 요소의 텍스트 내용 설정

innerText 예제 - 요소의 텍스트 내용 반환

 

<button onclick="homzzang()" id="hz">홈짱닷컴 Homzzang.com</button>

<p id="demo"></p>

<script>

function homzzang() {

  var x = document.getElementById("hz").innerText;

  document.getElementById("demo").innerHTML = x;  

}

</script>

 

결과보기

---

PS. 아래처럼, 짧게 표현도 가능. 관련글

 

<button onclick="homzzang()" id="hz">홈짱닷컴 Homzzang.com</button>

<p id="demo"></p>

<script>

function homzzang() {

  document.getElementById("demo").innerHTML = hz.innerText;  

}

</script>

 

 

결과값: 홈짱닷컴 Homzzang.com

innerText 예제 - 요소의 텍스트 내용 설정

 

<button id="hz">홈짱닷컴</button>

<p id="demo"></p>

<script>

hz.innerText="Homzzang.com";

</script>

 

결과보기

결과값: Homzzang.com