DOMNodeInserted équivalent dans IE?

En plus d'utiliser une minuterie pour compter le nombre d'éléments au fil du temps et à la recherche de changements, je ne peux pas penser à une meilleure façon de simuler cet événement.

Existe-t-il une sorte de version IE propriétaire de DOMNodeInserted? Merci.

Non, il n'y en a pas. Le plus proche est l'événement d' propertychange , qui se déclenche en réponse à une modification d'un attribut ou d'une propriété CSS d'un élément. Il se déclenche en réponse à la modification de la propriété innerHTML d'un élément directement mais pas lorsque le contenu des éléments est modifié par d'autres moyens (par exemple en utilisant des méthodes DOM telles que appendChild() ou en modifiant le innerHTML d'un élément enfant).

MISE À JOUR 6 février 2014

Comme indiqué dans les commentaires, il y a une solution de contournement. C'est basé sur un hack élaboré et je recommanderais d'utiliser des observateurs de mutation à la place autant que possible. Voir la réponse de @ naugtur pour plus de détails . La réponse de @ naugtur a été supprimée, mais la solution se trouve à l' adresse https://github.com/naugtur/insertionQuery

Vous pouvez surcharger toutes les méthodes de manipulation DOM – appendChild, insertBefore, replaceChild, insertAdjacentHTML, etc. – et moniteur innerHTML avec onpropertychange.

Vous pourriez être en mesure de trouver une solution qui répond à vos besoins.

BTW, il semble que DOMNodeInserted, etc, sera obsolète par les navigateurs dans le futur. Voir http://www.w3.org/TR/DOM-Level-3-Events/#events-mutationevents

Onreadystatechange fonctionnera dans IE. Un comportement DHTML doit être attaché à l'élément via htc, mais le fichier htc ne doit pas exister:

 if (!!document.addEventListener) { $(domnode).get(0).addEventListener("DOMNodeInserted", fixtext, false); } else { $(domnode).get(0).addBehavior("foo.htc"); $(domnode).get(0).attachEvent("onreadystatechange", fixtext); } 

Référence d'événement onreadystatechange

Une solution de rechange sale consiste à intercepter les méthodes prototypes du type Élément comme suit:

 window.attachEvent('onload', function() { invokeNodeInserted(document); (function(replace) { Element.prototype.appendChild = function(newElement, element) { invokeNodeInserted(newElement); return replace.apply(this, [newElement, element]); }; })(Element.prototype.appendChild); (function(replace) { Element.prototype.insertBefore = function(newElement, element) { invokeNodeInserted(newElement); return replace.apply(this, [newElement, element]); }; })(Element.prototype.insertBefore); (function(replace) { Element.prototype.replaceChild = function(newElement, element) { invokeNodeInserted(newElement); return replace.apply(this, [newElement, element]); }; })(Element.prototype.replaceChild); }); 

L'utilisation de la modification de l'état de la route, suggérée par Paul Sweatte, ne fonctionne pas vraiment. L'événement readystatechange n'est déclenché que pendant le chargement de foo.htc. Cela n'a rien à voir avec la modification du noeud DOM.

J'ai mis en place un petit violon pour le démontrer. Consultez http://jsfiddle.net/Kermit_the_frog/FGTDv/ ou http://jsfiddle.net/Kermit_the_frog/FGTDv/embedded/result/ .

HTML:

 <input type="button" id="fooBtn" value="add" /> <div id="fooDiv"></div> 

JS / Jquery:

 function bar(e) { var state = $('#fooDiv').get(0).readyState; alert (state); } $("#fooBtn").on("click", function(){ $('#fooDiv').get(0).addBehavior("foo.htc"); $('#fooDiv').get(0).attachEvent("onreadystatechange", bar); }); 

Comme vous pouvez le voir: même s'il n'y a pas de manipulation de DOM, il y a un événement readystatechange.

Par exemple, les comportements DHTML peuvent être utilisés dans IE à l'émulatif DOMNodeInserted .