변경

1. element.innerHTML

요소노드 내부의 HTML코드를 문자열로 리턴한다. 내부에 있는 줄 바꿈이나 들여쓰기도 포함

요소노드 내부의 HTML 자체를 수정할 때 자주 활용된다.

내용을 수정하게되면 새로운 값으로 기존에 있던 값이 교체되어 주의해서 사용해야한다.

Untitled

2. element.outerHTML

요소노드의 전체적인 HTML 코드를 문자열로 리턴한다. 위와 같이 내부에 있는 줄 바꿈이나 들여쓰기도 포함

outerHTML도 새로운 값을 할당시 요소 자체가 교체되어 버리기 때문에 주의해서 사용해야한다.

Untitled

3. element.textContent

요소 안의 내용들 중 HTML 태그를 제외한 텍스트만 가져온다.

안에 특수문자를 사용해도 텍스트 형태로 변환되어 나오기때문에 HTML태그를 감싼 텍스트를 출력하고싶다면

innerHTML을 사용하면 된다.