Sélectionner les DIV A qui ne sont pas imbriqués dans une DIV B

bonjour,

j'arrive pas à sélectionner que les élements qui ne sont pas imbriqués dans un élement déterminé.
Dans ma tête, je me dis "sélectionner que les DIV de "qui n'ont pas le div de "groupement" comme parent"

exemple de code :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12

<td> <div class="groupement"> <div class="solo"> a </div> <div class="solo"> b </div> </div> <div class="solo"> c </div> <div class="groupement"> <div class="solo"> d </div> <div class="solo"> e </div> </div> <div class="solo"> f </div> </td>

---

si je fais $(".solo") ça me sort "a b c d e f" alors que je ne veux que "c f" car ils ne sont pas encapsulés dans une div classée "groupement"


j'ai aussi tenté par désespoir cela :

Code:

---

$(".solo").not(".groupement")

---

mais ça ne marche pas hélas....:calim2:

comment faire ?

Bonjour,

Citation:

---

Envoyé par clavier12AZQSWX

j'ai aussi tenté par désespoir cela :
...
mais ça ne marche pas hélas....:calim2:

---

il n'y a pas de place au hasard !

A supposer que tous les éléments cités soient contenus dans une <td> tu n'auras que la possibilité d'accéder aux éléments de premier niveau, enfants directs donc, de la façon suivante :

Code:

---

1 2 3

td > .solo { color: #FF0; }

---

à toi de transformer cela en sélecteur jQuery ;)

\ô/

Code:

---

1 2 3 4 5

<div class="groupement"> <div class="solo"> a </div> <div class="solo"> b </div> </div> <div class="solo"> c </div>

---

d'un autre côté avoir un élément enfant solo d'un élément parent groupement n'aide pas forcément le ciblage et l'éventuelle sémantique via les classes.

Code:

---

1 2 3 4 5

<div class="groupement"> <div> a </div> <div> b </div> </div> <div class="solo"> c </div>

---

serait plus opportun.

bonsoir,

je ne suis plus au taf, mais je pense que je vais donc essayer $(".groupement> .solo") :)

et en attendant, j'avais trouvé une rustine dans ma boucle des $(".solo") :

Code:

---

1 2 3 4 5 6 7 8 9 10 11

classe_du_parent=$(this).parent().prop('className'); if (classe_du_parent!="groupement") { //faisons nos trucs } else { //on fait rien car l'élement est dans une div groupement }

---

Citation:

---

Envoyé par clavier12AZQSWX

et en attendant, j'avais trouvé une rustine dans ma boucle des $(".solo") :

---

mais pourquoi prends tu le problème à l'envers ?

Outre le sélecteur que je t'ai proposé, qui me semble être le plus simple, tu peux également utiliser :

Code:

---

1 2 3 4 5 6 7 8 9

td > .solo { color: #F00; } :not([class="groupement"]) > .solo { font-weight: 700; } :not(.groupement) > .solo { font-size: 2em; }

---

ce qui se traduit en jQuery par :

Code:

---

1 2 3 4 5

const elements = $("td > .solo"); // ou const elements = $(":not([class='groupement']) > .solo"); // ou autre écriture const elements = $(":not(.groupement) > .solo");

---

Les sélecteurs se lisent de la droite vers la gauche.

Il te faut revenir aux fondamentaux :

• Table de référence des sélecteurs
• La pseudo-classe de négation, :not()

Citation:

---

Envoyé par Dave Hiock

d'un autre côté avoir un élément enfant solo d'un élément parent groupement n'aide pas forcément le ciblage et l'éventuelle sémantique via les classes.

---

Tout à fait mais il me semble avoir lu qu'il n'avait pas la main sur le HTML.