Sélectionnez Nième frère précédent dans jQuery?

Question

J'essaie de configurer mon sélecteur jQuery mais je ne sais pas exactement comment je dois l'écrire.

J'ai une liste non ordonnée qui ressemble à ceci:

<ul>
    <li>something</li>
    <li>something</li>
    <li>something</li>
    <li>something</li>
    <li class="last">something</li>
</ul>

Maintenant, je sais que si je veux sélectionner le dernier enfant, je peux le faire en utilisant & "; ul li.last &"; ou " ul.li: last " mais dire si je voulais le deuxième du dernier, ou le troisième, ou le 20? Maintenant, est-ce que je ferais ça?

Answer 1

Vous utilisez eq :

$('ul li').eq(X);

Où X est un index à base 0 de quel élément vous voulez. Vous pouvez également utiliser le formulaire de sélection :

$('ul li:eq(X)');

Vous pouvez également obtenir un résultat similaire en utilisant nth-child :

$('ul li:nth-child(X)');

La documentation a ceci à dire sur la différence entre $('ul li').eq(19); et $('ul li:nth-child(20)');:

  

Alors que: eq (index) correspond à un seul élément, cela correspond à plus d'un: un pour chaque parent avec index. Multiple pour chaque parent avec pair, impair ou équation. L’index spécifié est un index, contrairement à: eq () qui commence à zéro.

Ainsi, en obtenant <ul>, vous obtiendrez le seul élément correspondant à la vingtième de la requête (ainsi, s'il y a plus d'une liste dans le document, cela ne vous donnera pas & "tous les 19ème enfant &" ;, tandis que <=> vous obtiendrez le 20ème élément de liste correspondant de chaque <=> dans le document.

MODIFIER :

Pour faire quelque chose comme & "Avant-dernier" & ";", la meilleure façon de le faire serait de:

var $ul = $('#mylist > li');
var $el = $ul.eq($ul.length-2);

Mais vous devriez probablement faire une vérification pour vous assurer que la longueur 2 n'est pas inférieure à 0.

Answer 2

Voulez-vous le 3ème du dernier?

var $ul = $("ul li");
$ul.find(":eq(" + Math.max(0, $ul.length - 3) + ")");

Explication rapide: la longueur de $ ul (qui est un objet jQuery) correspond au nombre de li trouvés. Vous pouvez donc utiliser cela avec le & Quot;: eq (n) & Quot; sélecteur pour obtenir le li à l’index souhaité.

J'ai utilisé Math.max au cas où la liste serait trop courte (moins de 3 li).

Cela fonctionnera aussi, mais ce n'est évidemment pas la meilleure façon:

var $ul = $("ul li:last").prev().prev();

Answer 3

Pour le troisième et le vingtième, vous pouvez faire ul li: eq (3) et ul li: eq (20) . Avant-dernier, vous pourrez peut-être faire quelque chose avec nth-child < L'option d'argument equation de / a>, bien que je ne sois pas sûr.

Answer 4

alert($('ul li').eq(3).text());

Cela alertera le texte du troisième élément de la liste.

Answer 5

L’équipe de jQuery a ajouté cette fonctionnalité à la version 1.9

Vous pouvez en apprendre davantage à ce sujet à l'adresse http://api.jquery.com/nth. -last-child-selector /