innerHTML과 outerHTML 차이

innerHTML

innerHTML에서 지정한 요소 태그를 제외한 안쪽 태그만 값을 가져온다

자기자신 미포함

 

outerHTML

outerHTML에서 지정한 요소 태그도 포함하여 값을 가져오고

선택한 엘리먼트를 포함해서 처리

자기자신 포함

 

<div id="test">TEST</div>
 
<script type="text/javascript">
alert(document.getElementById('test').innerHTML);
//결과는 TEST
 
alert(document.getElementById('test').outerHTML);
//결과는 <div id="test">TEST</div>

</script>
</body>

출처: https://na27.tistory.com/226 [na27]