DOMNodeInserted DOMNode與MutationObserverRemoved等價嗎？

Question

我現在有代碼：

$('.example').bind('DOMNodeInserted DOMNodeRemoved', function(event) { 
    .... 
}); 

這完美的作品，但它是不是很有效，至今已過時的。有什麼更好的方法來做到這一點？

我一直在調查MutationObserver，但這段代碼確實有用嗎？

它給出的錯誤「mutation.addedNodes不是一個函數」我也需要我認識的removedNodes。

var observer = new MutationObserver(function(mutations) { 
     mutations.forEach(function(mutation) { 
     mutation.addedNodes.forEach(function(node) { 
      if (node.className == 'example') { 
       .... 
      } 
     }); 
     }); 
    }); 
    observer.observe(document, { 
     childList: true, 
     subtree: true, 
     attributes: false, 
     characterData: false, 
    }); 

Answer 1

.addedNodes返回NodeList不是Array，不具有.forEach()方法。嘗試使用Array.prototype.slice()投.addedNodes到Array具有.forEach()

var observer = new MutationObserver(function(mutations) { 
 
     mutations.forEach(function(mutation) { 
 
     var nodes = Array.prototype.slice.call(mutation.addedNodes); 
 
     nodes.forEach(function(node) { 
 
      if (node.parentElement.className == "example") { 
 
       alert(node.parentElement.className) 
 
      } 
 
     }); 
 
     }); 
 
    }); 
 
    observer.observe(document.querySelector(".example"), { 
 
     childList: true, 
 
     subtree: true, 
 
     attributes: false, 
 
     characterData: false, 
 
    }); 
 

 
var el = document.createElement("div"); 
 
el.className = "example-child"; 
 
document.querySelector(".example").appendChild(el)

<div class="example"></div>