Comment détecter la création de nouveaux éléments dans jQuery?

Question

Disons que j'ai le code suivant qui renvoie le nombre d'éléments d'ancrage sur une page:

function getLinkCount() {
    alert("Links:" + $("a").length);
}

Si j'appelle sur le document prêt, il ne fonctionnent pas comme prévu. Mais si, maintenant, un nouveau lien est inséré dans une page dynamiquement à l'aide de javascript, comment puis-je obtenir notifié à exécuter lien fonction de compteur de nouveau? (Je n'ai pas de contrôle sur un script qui permettait de créer un nouveau lien).

Fondamentalement, je suis à la recherche de quelque chose de similaire live() seulement qui serait observation de l'élément de la création de l'événement, quelque chose comme:

$("a").live("create", getLinkCount);

qui pourrait déclencher lorsqu'un nouvel élément est créé.

Answer 1

Vous pouvez utiliser l'événement DOMSubtreeModified. Par exemple:

 $(document).bind('DOMSubtreeModified',function(){
  console.log("now there are " + $('a').length + " links on this page.");
})
 

Answer 2

Vous pouvez utiliser l' .livequery() plugin pour cela, il s'exécute pour chaque élément, y compris les nouveaux, comme ceci:

$("a").livequery(getLinkCount);

Cependant, ce plugin est à jour et n'est pas recommandé pour les dernières versions de jQuery.

Il est généralement plus facile de le faire lorsque vous créez les éléments si, par exemple si vous faites cela après des requêtes AJAX, l' .ajaxComplete() gestionnaire peut être un bon endroit, par exemple:

$(document).ajaxComplete(getLinkCount);

Ce serait courir après chaque demande, et puisque vous avez l'habitude de créer des éléments dans votre success gestionnaire, ils seraient déjà présents lorsque ce gestionnaire s'exécute.