innerHTML 🆚 innerText 🆚 textContent

Jihoon Han·2021년 8월 22일

Event 연습을 하던 도중 문득 든 생각,
innerHTML, innerText, textContent는 무슨 차이가 있지?

innerHTML

innerHTML은 'Element'의 속성으로, 해당 element의 HTML, XML을 읽어오거나 설정할 수 있다.
즉, 해당 요소 내의 모든 HTML 내용을 그대로 가져온다.

innerText는 'Element'의 속성으로, 해당 element 내에서 사용자에게 보여지는 텍스트 값을 읽어온다.
특이한 점은 연속되는 공백은 무시하고 하나의 공백만 보여준다.

textContent는 'Node'의 속성으로, 해당 node가 가지고 있는 텍스트 값만 그대로 읽어온다.

달려라 코린이!!