Comment obtenir le numéro de commande de l'élément

Question

comment puis-je obtenir le numéro de commande d'un élément par javascript/jquery?

<ul> 
<li>Anton</li> 
<li class="abc">Victor</li> 
<li class="abc">Simon</li> 
<li>Adam</li> 
<li>Peter</li> 
<li class="abc">Tom</li> 
</ul> 

Il y a 3xli avec la classe abc. Maintenant, j'ai besoin d'obtenir le numéro de séquence (ordre) de Simon li.

Merci à l'avance

Answer 1

Avec la méthode de Jquery index()

Answer 2

Vous pouvez le faire comme ceci à l'aide d'un sélecteur avec .index(), comme ceci:

Sans le sélecteur, vous devriez obtenir 2, l'indice du <li> dans le parent global, indépendamment de la classe. You can view a quick demo here. Gardez à l'esprit que c'est un index basé sur 0, peut-être besoin de + 1 le résultat de l'affichage dans certains cas, dépend de ce que vous avez besoin pour.

Answer 3

Juste une solution pour la réponse @Nick Craver. J'ai essayé d'utiliser .index('.class_name') et cela a continué à retourner -1 pour un non trouvé. Ce que j'ai fait alors était .index($('.class_name')) ce qui m'a donné le résultat escompté. Je suppose que cela nécessite un objet nœud dom pour sa valeur et pas seulement un sélecteur.

Answer 4

Pour ceux qui préfèrent l'approche You Might Not Need Jquery, voici la méthode:

function index(el) { 
    if (!el) return -1; 
    var i = 0; 
    do { 
     if (el.nodeType === 1) i++; 
     el = el.previousSibling; 
    } while (el) 
    return i; 
} 

la version IE9 +:

function index(el) { 
    if (!el) return -1; 
    var i = 0; 
    do { 
     i++; 
    } while (el = el.previousElementSibling); 
    return i; 
}