[지식루프 IT공부] innerHTML과 outerHTML의 차이

1. innerHTML

• 선택한 요소의 내부 HTML 콘텐츠를 가져오거나 설정할 때 사용합니다.
• 즉, 태그 내부의 내용을 조작하는 역할을 합니다.
• 기존의 내용을 변경할 수도 있고, 새로운 HTML 요소를 삽입할 수도 있습니다.

 

 

2. outerHTML

• 선택한 요소 자체를 포함한 전체 HTML을 가져오거나 변경할 때 사용합니다.
• 즉, 해당 요소 자체를 완전히 새로운 HTML로 대체할 수도 있습니다.

 

정리

즉, innerHTML은 내부 콘텐츠만 바꾸고, outerHTML은 요소 자체를 바꿉니다.