엘리먼트가 제거되었을 때 DOM에 의해 통지받는 방법이 있습니까?

Question

내 초기 연구가 비어있어 이것이 가능한지 확실하지 않습니다. 나는 곧바로 자바 스크립트를 사용하여 솔루션을 찾고 있습니다. 나는 장치의 제약 때문에 jQuery를 사용할 수 없다. 기본적으로 요소 제거시 이벤트를 첨부하고 실행할 함수를 제공하려고합니다.

[편집]
우리는 함수 호출을 통해 DOM 조작을한다. 현재, 우리는 현재 모든 단일 요소를 제거하기 위해 전체 트리를 가로 지르지 않습니다. 예를 들어 부모 만 삭제합니다. 나는 이벤트에 연결하여 지름길을 제공하기를 바랬지 만, 나는 먼 길을 가야만하고 함수에 추가적인 로직을 제공해야 할 것 같다. 그 이유는 특정 요소가 제거 될 때 DOM에서 정리 작업을 실행할 수 있어야하기 때문입니다.

지금 우선 순위는 오페라 지원 일 뿐이지 만 크로스 브라우저 솔루션을 완성하고자합니다.

Answer 1

브라우저 간 지원에 관심이 있으시면 "on element removal"이 an HTML 4 event이 아니므로 여기에서 운이 좋지 않을 수도 있습니다. 그러나 대체 전략을 채택하면 운이 좋을 것이라고 생각합니다. 제거를 수행하기 때문에 은 요소를 제거 할 수있는 방법을 제한합니다.. 그런 다음 단순히 이벤트 핸들러 대신 콜백을 호출하십시오.

Answer 2

똑 바른 대답은 아니오입니다. 현재의 DOM 구현은 DOM 변경을 감시하기 위해 후크 할 수있는 이벤트를 제공하지 않습니다.

아마도 당신은 당신이 왜 이것을 필요로하는지 질문에 추가 할 수 있습니다. 대안이있을 수 있습니다. 예를 들어 DOM 요소가 코드에 의해 제거되면 해당 코드를 관찰자 패턴에 참여하도록 수정할 수 있습니까? 없는 인터넷 익스플로러에서 파이어 폭스에서

http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-eventgroupings-mutationevents

현재이 단지 작품 :

Answer 3

당신은 DOM 돌연변이 이벤트가 정의라는 것이 있습니다.

Answer 4

노드를 제거하는 방법을 알고 싶습니다.

제거 후 얼마나 빨리 알 필요가 있습니까? 1 초에 한 번씩 확인할 수 있습니까?

Answer 5

DOM 전문가가 아니지만 removeChild 메소드를 재정의 할 수 있습니까?

DOM 요소가 없어지는 다른 방법이 있으므로 (예를 들어 innerHTML을 설정하는 등) 작동하는 경우 완벽한 해결책은 아닙니다.

부모에게 자식 수를 저장할 수도 있습니다. 그런 다음 그 카운트를 실제 자식 카운트와 비교하십시오. 물론 폴링이 필요합니다. 이벤트가 아닙니다.

Answer 6

자바 스크립트가 강하지는 않지만 다음 코드를 빠르게 조롱하고 Firefox에서 작동했습니다. 다른 브라우저에서 작동하도록 운이 좋을 수도 있습니다.

removeFromDOM(e) { 
    for (var i = 0; i < e.childNodes.length; ++i) { 
     var child = e.childNodes[i]; 
     removeFromDOM(child); 
     if (typeof child.onremove == 'function') { 
      child.onremove(); 
     } 
     e.removeChild(child); 
    } 
} 

이 재귀 적으로 모든 중첩 된 노드를 삭제합니다 : 당신이 당신의 질문을 업데이트하기 때문에

<ul id="main"> 
    <li id="e1">Item 1</li> 
    <li id="e2">Item 2</li> 
</ul> 

<script type="text/javascript"> 
var main = document.getElementById('main'); 
main.origRemoveChild = main.removeChild; 
main.removeChild = function(child) { 
    alert('Removing element ' + child.tagName + ' with id=' + child.id); 
    this.origRemoveChild(child); 
} 
var e1 = document.getElementById('e1'); 
main.removeChild(e1); 
</script> 

나는 다른 여기에 해결책을 가지고 있습니다.삭제하기 전에 onremove 메서드가 실행되도록 시도합니다. 희망이 도움이됩니다.