JQuery sélécteur multiple, combinaison AND

Résolu/Fermé
Rom1 - 9 janv. 2013 à 11:14
 Rom1 - 9 janv. 2013 à 14:29
Bonjour,

Voici mon besoin : à l'aide de la bibliothèque jQuery, j'aimerai sélectionner tous les éléments de ma page web de type h1, h2, h3... (':header') qui possèdent la classe "editable" ('.editable').


Impossible de trouver la réponse sur google (le mot "AND" est un mot clé de la recherche...), tout le monde parle du selecteur multiple $(':header, .editable') qui me renverrai tous les éléments de type header OU possédant la classe '.editable'.


Il est bien sûr possible de sélectionner tous les éléments "header" et de vérifier ensuite pour chacun s'il possède la classe editable, mais ça ne me parait pas judicieux.


Quelqu'un connait-il la bonne syntaxe ?


Merci d'avance,
Romain.

3 réponses

Heryu Messages postés 567 Date d'inscription mercredi 15 juillet 2009 Statut Membre Dernière intervention 28 juin 2016 62
Modifié par Heryu le 9/01/2013 à 11:33
En javascript, c'est plutôt && que AND, essaye avec ça.

Sache aussi que quand tu sélectionne un élement unique (avec un ID donc, tu dois faire $('#nom_element'), tandis que si c'est une class (pour plusieurs élements, dans ton cas donc), c'est $('.nom_class')).
0
Utilisateur anonyme
9 janv. 2013 à 11:50
Bonjour

$(':header .editable') sans la virgule semble marcher. En fait, c'est ce qu'on fait en CSS sans jquery
0
@Heryu : le symbole && sert à faire une ET entre deux conditions. Je parle ici de sélecteur jQuery, pas de test conditionnel.

@le père : la syntaxe sans la virgule est juste, mais je n'obtiens pas ce que je veux.
En effet, d'après la doc (http://api.jquery.com/descendant-selector/), je selectionnerai tous les éléments ayant une classe "editable" qui sont descendant (fils, petit-fils, etc..) d'un "header".

Or, moi je veux appliquer le filtre de classe sur l'élément de type "header" lui-même !


EDIT : Mais merci à toi, papa, tu m'as mis sur la voie de la solution !

Tu avais raison de me faire chercher du coté CSS. Comme en CSS, la solution est de concaténer le deux sélecteurs comme ceci :

$(':header.editable');  
Ceci sans espace !

J'espère que la réponse servira à quelqu'un d'autre. Et merci CCM !
0