Fonctionnalité | JavaScript pur | jQuery |
---|---|---|
Performance | Généralement plus rapide en raison des API natives optimisées | Plus lent en raison de l'abstraction et de la simplification |
Taille du fichier et temps de chargement | Aucune bibliothèque supplémentaire requise, ce qui réduit la taille | Nécessite une bibliothèque supplémentaire, augmentant la taille |
Compatibilité des navigateurs | Amélioration de la prise en charge dans les navigateurs modernes ; Nécessite d'utiliser un détection des fonctions et des polyfills en cas de besoin | Développée à l'origine pour la compatibilité multi-navigateurs ; toujours utile pour les anciens navigateurs |
Syntaxe | Syntaxe JavaScript native | Syntaxe simplifiée fournie par jQuery |
Courbe d'apprentissage | Une compréhension solide est requise ; de nombreuses ressources sont disponibles | Plus facile à apprendre, documentation extensive |
Support communautaire | Communauté croissante, nombreux tutoriels et ressources | Communauté importante, ressources bien établies |
$(once(identifiant, selecteur, contexte)).each(
() => console.log(this)
);
once(identifiant, selecteur, contexte).forEach(
(element) => console.log(element)
);
$(element).find('label');
$(element).querySelectorAll('label');
$(element).parent('label');
element.closest('label');
$(element).data('toto');
element.dataset.toto;
$(mon_input).parent('form');
mon_input.form
$('label[data-attribute]').each(
() => console.log(this)
);
document.querySelectorAll('label[data-attribute]').forEach(
(element) => console.log(element)
);
$ = function (sel){
return document.querySelectorAll(sel);
}