[javascript] value, textContent, innerHTML, innerText

1. value

 

input이나 form 요소의 문자열을 가져옴

 

 

2. textContent

 

input이나 form 외의 문자열을 읽고, 변경 가능

 

 

3. innerHTML

 

HTML의 태그 요소까지 직접 입력할 수 있음

(* XSS 공격 대상이 될 수 있음)

let hi = document.querySelector('.text');
let time = new Date(); 

hi.innerHTML = `<span> time: ${time} </span>`

 

 

4. innerText

 

style이 적용된 최종 형태를 가져옴

(human-readable한 글자만 읽기 가능)