J'ai entendu dire que querySelector
& querySelectorAll
sont de nouvelles méthodes pour sélectionner les éléments DOM
. Comment se comparent-ils aux méthodes plus anciennes, getElementById
& getElementsByClassName
en termes de performances et de prise en charge du navigateur?
Comment les performances se comparent-elles à l'utilisation du sélecteur de requête de jQuery?
Existe-t-il une recommandation de meilleure pratique pour chaque ensemble natif à utiliser?
"Mieux" est subjectif.
querySelector
est la nouvelle fonctionnalité.
getElementById
est mieux pris en charge que querySelector
.
querySelector
est mieux pris en charge que getElementsByClassName
.
querySelector
vous permet de trouver des éléments avec des règles impossibles à exprimer avec getElementById
et getElementsByClassName
Vous devez choisir l'outil approprié pour une tâche donnée.
(Dans ce qui précède, pour querySelector
, lisez querySelector
/querySelectorAll
).
Les fonctions getElementById
et getElementsByClassName
sont très spécifiques, tandis que querySelector
et querySelectorAll
sont plus élaborées. À mon avis, leur performance sera pire.
En outre, vous devez vérifier le support de chaque fonction dans les navigateurs que vous ciblez. Plus il est récent, plus la probabilité de défaut de support ou la fonction est "instable" est élevée.