Div를 제거하면 다른 div의 onclick이 제거됩니까?

Question

은 이상한 행동을합니다.

(function(){ 
    var images=document.getElementsByTagName('img'); 
    for (var i = 0; i < images.length; i++) { 
     images[i].parentNode.onclick = function() { 
      var embed = "whatever"; 
      document.body.innerHTML = '<div id="overlay"><div class="game">' + embed + '</div></div>' + document.body.innerHTML; 
      document.getElementById('overlay').onclick = function() { this.parentNode.removeChild(this); } 
     } 
    } 
})(); 

이 오프라인 코드는 단순화 된 코드입니다. 오버레이를 클릭 한 후 오버레이 (및 컨테스트)가 제거됩니다. 하지만 이미지가 더 이상 작동하지 않습니다. 왜 이런 일이 발생하는지 알고 싶습니다.

Answer 1

이 때문에 다음 줄입니다 : 다음은 이미지를 포함한 모든 요소에 바인딩 된 모든 이벤트를 제거의 문자열로 직접 HTML 내용을 연결

document.body.innerHTML = '...' + document.body.innerHTML; 

.

innerHTML 속성을 변경하는 대신 동적으로 오버레이 블록을 만들고 body 앞에 추가하는 것이 좋습니다.