J'ai lu qu'il est préférable de choisir d'utiliser "ID" que "Classe" avec JQuery. Cependant, disons que j'ai plusieurs divs sur une page que je dois sélectionner avec jQuery et effectuer la même manipulation. Je ne peux pas sélectionner avec l'attribut "ID" car il serait nolonger être unique. Par exemple: qui me laisse (je pense?) avec 2 alternatives: p> Utiliser les sélecteurs de classe p> <div data-select="selectMeOnClick">
...
</div>
5 Réponses :
J'utiliserais des sélecteurs de classe. Utilisation des sélecteurs d'attributs personnalisés serait:
.getelementsbyclassname dans votre premier extrait, il ne peut pas pour la seconde. Cela pourrait entraîner un ralentissement des navigateurs modernes.
Comme pour # 1 ... L'exemple OPS est parfaitement valide dans HTML 5.
Merci pour votre réponse. Comme le dit le commentaire ci-dessus, il est valide à partir de HTML 5, ce n'est donc pas une préoccupation pour moi. Comme avec # 2: j'ai imaginé que c'est le cas. Est-ce un fait qu'il est plus lent? Si oui, je vais marquer cela comme la bonne réponse.
@Yakobeyak - si la sélection est lente dépendra ou non du navigateur. La première chose que JQuery essaie lors de la sélection de la catégorie QuerySelectorall (code> QuerySelectorALL . S'il existe et que le sélecteur est valide, il sera très rapide.
@Yak: Je supposerais getelementsbyclassname pour être plus rapide dans les navigateurs qui le supportent. Cependant, de nombreux navigateurs prennent également en charge queryselectorall , y compris IE 8, qui ne prend pas en charge getelementsbyclassname et nécessite une implémentation plus lente et non native. Je serais certainement intéressé à voir des points de repère.
Ajouter une référence à mon commentaire de mon et @ andy, Voici une liste de compatibilité de navigateurs qui supportent queryselectorall . Comme vous pouvez le constater, il est largement pris en charge dans les navigateurs modernes.
Je suppose que cela signifie que nous ne savons pas que ce soit plus rapide de la sélection par classe ou par attribut personnalisé? Je me demandais seulement si l'attribut serait plus rapide car un attribut n'a qu'une seule valeur alors qu'une balise peut avoir de nombreuses classes dans l'attribut de classe.
@Yankobeyak: J'ai fait un test de performance utilisant jQuery. jsperf.com/attribute-versus-class-selector Le sélecteur de classe, pour chaque navigateur , est plus rapide que le sélecteur d'attributs (par quelques pour cent). Dans IE, cependant, il y a une différence de plus de 20%.
En fait, exécutez ces tests maintenant à Firefox donne des résultats assez égaux, l'attribut personnalisé étant légèrement plus rapide la plupart des temps, tandis qu'en chrome, il s'agit d'environ 40% (SIC!) plus lentement et à Vivaldi environ 30% (et Vivaldis Class Seletor 15% plus lent que les chromes pour une raison quelconque), intéressant comment ces choses comme ces changements au fil du temps
et exécuter R24 Firefox rend l'attribut personnalisé 66% plus lentement pendant que Chrome est de 75%
L'identifiant est le plus rapide de JavaScript. Parce qu'il n'y a qu'un seul élément à coup sûr (si votre code est valide). La classe et la personnalité Attr vont être la même vitesse que je pense.
Je n'aime pas utiliser les attributs personnalisés car ce n'est pas valide et cela rend le Dom assez désordonné. Je préfère utiliser .data () pour stocker des données relatives à l'élément sélectionné.
Oui, il est préférable d'utiliser "ID" que "Classe" avec JQuery. Mais non seulement avec jQuery. C'est une approche générale.
Dans votre situation, vous devez fournir plus d'informations. Si vous souhaitez sélectionner plusieurs divs avec la même classe - peut être chacun d'entre eux sont un enfant d'autres Div, E.T.c. Et vous pouvez les obtenir comme un enfant de certains div, que vous pouvez obtenir par ID.
Vous devez créer une telle structure DOM que vous pouvez accéder aux éléments par ID ou logiquement par certaines propriétés.
En outre, si vous souhaitez modifier un attribut CSS dans la classe CSS exacte, ce n'est pas la pire idée d'obtenir des div en classe.
Les sélections d'attribut personnalisées ne sont pas bonnes. Ce n'est pas valide.
Pour une sélection simple, comme cette performance ne sera pas un problème. Mais si votre update : selon puis le sélecteur le plus rapide serait Div's est dans un conteneur avec un identifiant, par exemple $ ('# # SelectMeonClick')
Il n'a pas besoin de construire un nouvel objet JQuery.
Point pris, je ne vois pas cela comme un coût énorme, mais vous avez raison :)
J'utilise personnellement en fonction de l'occasion. Si, par exemple, une rangée dans la table représente certaines données que je veux avoir la pose autour, mais pas d'affichage non nécessairement, j'utilise des attributs personnalisés. Parfois, il est tellement agréable d'écrire des trucs ceci: et ne pas être obligé de gâcher avec des classes d'éléments. Je me rends compte qu'il est un peu plus lent, mais en tenant compte de ce qu'il ne se produise qu'une fois après la charge de la page, je peux vivre avec ça.