2010-07-12 6 views
2

Je suis juste en train d'apprendre jQuery et j'ai été incapable de trouver quelqu'un de spécifiquement répondre à cette question. Pour les performances, serait-il préférable de sélectionner $ ('# element') ou $ ('div # element')? Est-ce que cela fait une différence?jQuery Selector Spécificité

+0

Votre question est destinée à demander si elle fait une différence dans la fonctionnalité, ou une différence de vitesse? –

+1

OP a déclaré la performance. – ScottE

Répondre

4

Il est recommandé de ne pas placer le nom du tag avant un ID.

Les recherches d'ID utilisent le getElementById() natif et sont extrêmement rapides, donc toute comparaison supplémentaire non requise ralentira simplement le sélecteur. En général, utilisez $('#myID') au lieu de $('div#myID').

La différence de performance est minime, mais c'est le cas pour de nombreuses bonnes pratiques.

Probablement la seule fois où cela peut être nécessaire serait lorsque vous utilisez le même fichier javascript pour 2 pages différentes où le même ID est utilisé dans les deux pages, mais sur différents types de balises. Ensuite, vous auriez besoin du spécificateur.

Si c'est le cas, vous feriez mieux d'ajuster vos identifiants.

+0

Juste curieux si vous connaissez un test qui pourrait le prouver? – mysmallidea

0

Oui, cela peut faire la différence. Comme dans css, essayez de garder les choses aussi spécifiques que possible.

Les différences sont probablement minimes, mais en cas de doute, profil dans Firebug.

Je vous prendrai rapidement une référence.

Modifier

Je ne peux pas trouver une référence rapide des tests de vitesse, mais cela est probablement l'une de ces optimisations prématurées qui ne vaut pas se soucier, en particulier en utilisant ID. Je pense que le moteur de Sizzle est assez bon pour le trier.

Cela peut être plus problématique dans les sélecteurs plus complexes impliquant des étiquettes et des classes. Encore une fois, le profil!

Edit # 2

je aurais dû regarder les docs! oui, cela fait une différence - une recherche supplémentaire est nécessaire.

http://api.jquery.com/id-selector/#id

Et leur grande citation:

Comme toujours, rappelez-vous qu'en tant que développeur , votre temps est généralement la ressource la plus précieuse. Ne pas mettre au point sur l'optimisation de la vitesse du sélecteur à moins qu'il ne soit clair que les performances doivent être améliorées.

+0

Je suppose que je vous ai mal compris. Alors oui, ne soyez pas inutile. – jAndy

+0

@jAndy - Cela fait toute la différence. Pas beaucoup de différence, mais oui, c'est là. – user113716

-2

Si vous assumez ceci:

<span id="element"></span> 
<div id="element"></div> 

$("#element") sélectionnera les deux, alors que $("div#element") ne recevra que la div, il est plus spécifique.

+2

Les ID doivent être uniques. (bien que cela fonctionne, ce n'est pas une bonne pratique) – ScottE

+1

@ScottE - En fait, il échouerait probablement dans IE. Je crois que IE retournera toujours le premier '# élément 'qu'il trouve, indépendamment de l'inclusion du nom de balise dans le sélecteur. – user113716

+0

N'a pas été au courant de cela, merci. Pas que je fasse ça ... – ScottE