Supongamos que tengo un div#parent
y append
y remove
elementos utilizando jquery. ¿Cómo podría detectar cuándo ocurre un evento de este tipo en el div#parent
elemento div#parent
?
Utilice Mutation Observers como lo sugiere @Qantas en su respuesta
Los siguientes métodos están en desuso
Puede usar DOMNodeInserted y DOMNodeRemoved
$("#parent").on('DOMNodeInserted', function(e) { console.log(e.target, ' was inserted'); }); $("#parent").on('DOMNodeRemoved', function(e) { console.log(e.target, ' was removed'); });
Documentos de MDN
No use eventos de mutación como DOMNodeInserted y DOMNodeRemoved.
En su lugar, use Observadores de Mutación DOM, que son compatibles con todos los navegadores modernos, excepto IE10 y versiones anteriores ( ¿Puedo usarlo? ). Los observadores de mutaciones están destinados a reemplazar los eventos de mutación (que han sido desaprobados), ya que se ha encontrado que tienen un bajo rendimiento debido a fallas en su diseño .
var x = new MutationObserver(function (e) { if (e[0].removedNodes) console.log(1); }); x.observe(document.getElementById('parent'), { childList: true });
Debes enlazar el evento DOMSubtreeModified
$("#parent").bind("DOMSubtreeModified",function(){ console.log('changed'); });