1 - Syntaxe d'un sélecteur jQuery
Les sélecteurs jQuery sont l'une des parties les plus importantes de la bibliothèque jQuery.
Les sélecteurs jQuery vous permettent de sélectionner et de manipuler les éléments HTML, XHTM et CSS.
Les sélecteurs jQuery sont utilisés pour "trouver" (ou sélectionner) des éléments HTML / CSS en fonction de leur nom, identifiant, classes, types, attributs, valeurs d'attributs et bien plus encore. Il est basé sur les sélecteurs CSS existants, et en plus, il possède ses propres sélecteurs personnalisés.
Tous les sélecteurs dans jQuery commencent par la commande jQuery(), ou bien pour simplifier la syntaxe par le signe dollar et les parenthèses: $().
Le sélecteur d'élément jQuery sélectionne les éléments en fonction du nom de l'élément via la syntaxe :
Vous pouvez à titre d'exemple sélectionner tous les éléments <p> sur une page de la façon suivante:
Exemple ( cacher un paragraphe avec la méthode hide() )
Exemple complet
Ce qui affiche au navigateur après exécution :
Vous avez bien remarquer que le paragraphe : "Ce contenu sera caché à l'exécution !" a été caché à l’exécution
2 - Les différents types d'un sélecteur jQuery
On peut classifier les sélecteurs jQuery selon l'élément qu'ils sélectionnent :
2.1 - Sélecteur jQuery pour les balises HTML
Nous avons déjà traité ce type de sélecteur au paragraphe précédent. Sa syntaxe est de la forme :
Imaginons maintenant une page web qui contient plusieurs paragraphe et qu'on souhaite sélectionner un seul paragraphe bien déterminé la méthode $("p") ne peut être appliquer dans ce cas puisqu'elle sélectionne tous les paragraphes. Nous auron donc besoin des paramètres supplémentaires :
Exemple
L'exemple ci dessus permet de cacher le paragraphe à la position 1 qui est donc le 2ème paragraphe puisque le compteur commence à 0. Il va donc afficher après exécution au navigateur :
Contenu du premier paragraphe
Contenu du 3ème paragraphe
2.2 - Sélecteur jQuery pour les classes CSS
Les sélecteur jQuery peuvent aussi s'appliquer aux classes CSS en utilisant la syntaxe :
Exemple
Considérons la classe CSS suivante :
Essayons d'applique cette classe CSS à une balise div :
On obtient après exécution :
Mais si on ajoute le code de sélecteur jQuery suivant :
On obtient alors après exécution au navigateur :
Voici le code complet :
2.3 - Sélecteur jQuery pour les id CSS
Les sélecteurs jQuery pour les id CSS se fond de la même manirèe en remplaçant le code :
par :
Younes Derfoufi
CRMEF OUJDA
-
Python Programming Step-By-Step : Python Object-Oriented Programming
€ 13,00 Buy Now -
Routeur Tenda avec Carte SIM 4G09 AC1200 Bi- bandd 4G + Cat6 300Mbps, Connectivité Jusqu'à 64 Appareils
€ 89,00 Acheter le produit -
Débutant en Python : Programmer un réseau neuronal en 7 jours
€ 17,00 Acheter le livre