jQuery Girl
  1. jQuery Girl
  3. sélecteurs css vs jquery traversal
Intereting Posts
Comment mapper un tableau dynamic de champs de saisie sélecteur dynamic jQuery Jquery Tabs – Utilisation du lien URL externe PHP mysql nombre d’écanvass Affichage de kartik grondement via ajax dans yii2 jQuery ajout d’une classe – toutes les méthodes que j’ai essayées pour supprimer la classe au clic Demande revenant périodiquement vide en conditions de course Comment append un événement de clic jquery aux graphiques gRaphael? L’utilisation de Jquery pour renvoyer des éléments d’une chaîne XML ne fonctionne pas dans Internet Explorer 9 Insérer / supprimer dynamicment des champs à l’aide de JQuery Erreur CORS – Une demande Ajax renvoie des échecs intermittents avec l’API NYTimes Défilement animé d’ancre à ancre à l’aide du clavier avec jQuery Bootstrap Dual Listbox: Comment limiter l’option sélectionnée jQuery: cliquez sur un seul bouton, cliquez sur le tir événement deux fois ou plus Comment utiliser jQuery dans Grails 3.0

sélecteurs css vs jquery traversal

Avec jquery, il semble y avoir deux façons de trouver un élément de liste dans une liste non ordonnée dans le DOM. 

$("ul>li");

et 

 $("ul").find("li");

Y a-t-il une raison pour que ce dernier soit plus préférable? Il semble qu’il faudrait plus de code pour obtenir le même résultat.

Ouaip. La vitesse. .find() gagnera à chaque fois. Et la rapidité de traitement est équivalente!

test de vitesse jsPerf pour montrer ce que je veux dire

Bien que .find() obtienne tout ce qui est subordonné (enfants, enfants d’enfants, enfants d’enfants d’enfants, etc.), et > est un sélecteur direct d’enfants. Il est préférable de comparer les pommes avec les pommes suivantes:

  • $('ul li') vs $('ul').find('li')
  • $('ul > li') vs $('ul').children('li')

Bien que .find('li') rest le moyen le plus rapide, même plus rapide que .children('li') .

jsPerf mis à jour pour inclure .children()

1) ils ne sont pas identiques, la seconde forme serait équivalente à $("ul li"); et le premier est équivalent à $("ul").children("li")

2) Si vous utilisez le deuxième formulaire, vous simplifiez la tâche d’parsing de jQuery. Mais cela rend votre code moins simple, donc je ne le recommanderais pas, sauf si vous avez prouvé que la vitesse est très pertinente dans votre cas. Ceci étant dit, vous avez généralement plus de code avec, par exemple, une mise en cache d’éléments, ou d’autres fonctions de déplacement, justifiant l’utilisation de find .