11521 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Trouver l'ordre d'un enfant dans le DOM

bonsoir à tous

je voudrais savoir si il est possible, avec Javascript, avec un code html de ce type:

  <div class="parent">
    <div class="enfant">aaa</div>
    <div class="enfant">bbb</div>
    <div class="enfant">ccc</div>
    <div class="enfant">ddd</div>
    <div class="enfant">eee</div>
  </div>


Si je place un écouteur de l'évènement click sur un div.enfant, est ce que je peux déterminer quel est le rang de cet enfant de div.parent...?

Par exemple si je clique sur le div qui contient ccc, j'obtiens 3 par exemple...

c'est possible ??
Modérateur
et l'eau,

facile : 

  <div class="parent">
    <div class="enfant">aaa</div>
    <div class="enfant">bbb</div>
    <div class="enfant">ccc</div>
    <div class="enfant">ddd</div>
    <div class="enfant">eee</div>
  </div>





document.querySelectorAll('.parent .enfant').forEach(($el, i) =>{
  $el.addEventListener('click', e => alert(i + 1));
});


en jcuicui (de mémoire) : 

$('.enfant').on('click', function(){
  alert($(this).index() + 1);
})

Modifié par niuxe (13 Sep 2021 - 04:51)
Meilleure solution
niuxe a écrit :
et l'eau,

facile :

en jcuicui (de mémoire) : 

$('.enfant').on('click', function(){
  alert($(this).index() + 1);
})


Merci!!

et c'est hyper simple en + !!
t'es un génie Smiley smile
Sujet clos
Aller à