InnerText와 InnerHTML은 텍스트만 다룰때에는 차이가 없는데, 두 속성이 다루는 값이 text element인지, html element인지에 따라 차이점이 존재한다.
값 가져오기
element.innerText;: element 안의 text 값들만을 가져온다.
element.innerHTML;: element 안의 HTML을 가져온다.
값 설정하기
element.innerText = <div style='color:red'> 값 설정하기 </div>
이런식으로 innerText에 html을 포함한 문자열을 입력하면 html 코드가 문자열 그대로 element안에 포함된다.
element.innerHTML = "<div style='color:red'> 값 가져오기 </div> 은 속성에 html 코드를 입력하면 html이 element안에 포함한다! 위 예제에서 클릭하면 입력된 html태그가 빨간색으로 나타난것을 볼 수 있다.
