jQuery et les sélecteurs

Le sélecteur est une expression de chaîne qui identifie l’ensemble des éléments DOM qui seront collectés dans un ensemble correspondant à opérer par les méthodes jQuery.

Plan de cours

• Introduction
• Formats des sélecteurs CSS.
• Notions de base
• Sélecteurs de base
• Sélecteurs hiérarchiques
• Manipulation des éléments correspondants Manipulation des éléments correspondants
• Chaînage
• Enregistrement des gestionnaires d’événements
• Sujets avancés
• Sélecteurs d’attributs
• Sélecteurs d’éléments de formulaire Sélecteurs d’éléments de formulaire
• Sélecteurs positionnels
• Sélecteurs de filtrage de contenu
• Opérateurs avancés
• Manipulation de l’événement de la souris et du clavier du navigateur croisé

Extrait de cours

Les sélecteurs constituent le coeur de jQuery : toute manipulation des objets du DOM (Document Object Model) passe par l’utilisation de sélecteurs pour choisir les éléments de la page qu’on désire manipuler.

• Les sélecteurs CSS sont acceptés par jQuery.
• Pour sélectionner des éléments, on utilise la fonction

jQuery() ou, plus fréquemment, son alias $().

Exemples :

$(’#menu’).css(’border’,’1px solid red’);

$(’a’).css(’text-decoration’,’underline’);

Formats des sélecteurs CSS

Le sélecteur d’une règle CSS doit se lire de la droite vers la gauche : l’élément le plus à droite est l’élément sélectionné par la règle. Ceux à sa gauche forment les contraintes pour  ne sélection plus spécifique.

• Pour sélectionner un élément particulier, identifié à l’aide de son attribut id, on utilise l’identificateur de l’élément précédé du symbole dièse (#)
• Pour sélectionner tous les éléments d’une classe donnée, on utilise le nom de la classe précédé du symbole point (.)

Profitez de ce manuel de formation en PDF pour comprendre mieux le JQuery et enrichir votre connaissance.

Commencez à télécharger ce cours adapté pour vous et à apprendre JQuery.

13/03/2017
3
2. Formats des sélecteurs CSS (suite)
 Pour sélectionner un élém ent particulier, identifié à l’aide de son attribut id , on utilise l’identificateur de l’élément précédé du symbole dièse ( #) :
#menu
#basDePage
 Pour sélectionner tous les éléments d’une classe donnée , on utilise le nom de la classe précédé du symbole point ( .) :
.annonce
.important
5 A. Toudeft jQuery -Les sélecteurs
Élément dont l’attribut idest égal à menu .
Élément dont l’attribut idest égal à basDePage .
Tous les éléments dont l’attribut class est égal à annonce .
Tous les éléments dont l’attribut class est égal à important .
2. Formats des sélecteurs CSS (suite)
 Pour sélectionner tous les éléments descendants (enfants directs et indirects) d’un autre élément, on sépare l’ancêtre des descendants par un espace :
#menu li
div *
ul span
6 A. Toudeft jQuery -Les sélecteurs
Tous les éléments qui se trouvent à l’intérieur d’un descendants d’un div .
Tous les éléments lidescendants de l’élément dont le idest menu .
Tous les éléments span descendants d’un élément ul.