le MEMO du WEB développeur
••• JQuery •••  Liste des Mémos, astuces et bonnes pratiques

Siblings() Parcours des frères immédiats d'un élément

La fonction siblings() de JQuery renvoie la liste des frères (du même niveau) d'un élément donné.

Dans l'exemple suivant je parcours les frères DIV de l'élément d'identifiant #mondiv .

Pour le parcours j'utilise la fonction JQuery each().

Je demande d'afficher sur une alerte le contenu html de chaque frère précédé de la variable i qui est  incrémentée automatiquement lors du parcours, elle me donnera l'ordre du frère considéré.

Code HTML :

<div id="parent">
  <div> A </div>
  <div> B </div>
  <div id="mondiv"> C </div>
  <div> D </div>
<div>

Parcours des frères de l'élément 

$("#mondiv").siblings('div').each(function(i){
             alert (i +' : '+$(this).html());
});
// affichera '0 : A' puis '1 : B'  puis '2 : D'

Avertissement :

L'élément $("#mondiv") ne sera pas mentionné dans ses "siblings" ou frères (même s'il porte bien la classe .class_particuliere) !!

Dans le cas où l'on on souhaite parcourir toute la fratrie de l'élement  $("#mondiv"),  en incluant  $("#mondiv") (s'il porte bien la classe .classe_particuliere), il suffit de rechercher les fils div du parent de  $("#mondiv") à l'aide de la fonction JQuery children().

Parcours des frères de l'élément et lui même 

$("#mondiv").parent().children('div').each(function(i){
 alert (i +' : '+$(this).html());
});

 

publié le 13/12/2011 par Memo Web
Commenter le Mémo :

Atteindre une ancre avec JQuery
Charger JQuery directement via les librairies google
Empêcher de coller du texte dans un champs input de type text
Détecter lorsqu'on appuie sur la touche entrée en JQuery
Savoir si un élément est visible ou hidden
Comment faire des opérations avec les attributs de style exprimés en px
Connaître l'URL courante avec jQuery
Parcourir tous les éléments d'une classe en JQuery
StopPropagation() ou Empêcher un évenement de se propager aux parents de l'élément
Problème évenement click sous IE
Ajoutez vos propres Mémos sur MEMO-WEB

Il suffit de vous créer un compte sur le site

Vous pourrez choisir un thème parmis l'une des catégories proposées par MEMO-WEB.

Rédigez votre Mémo.
Après validation par MEMO-WEB, il sera mis en ligne.
Ajouter vos Mémos