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>