innerHTML과 outerHTML 차이

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>