Domanda

Sto cercando di impostare il mio selettore jQuery ma non sono esattamente sicuro di come devo scriverlo.

Ho un elenco non ordinato che assomiglia a questo:

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

Ora so che se voglio selezionare l'ultimo figlio posso farlo usando "ul li.last" o "ul.li:last" ma dico se voglio il penultimo, o il terzo, o il ventesimo?Adesso lo farei?

È stato utile?

Soluzione

Usate eq:

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

Dove X è un indice in base 0 dell'elemento desiderato.Potresti anche usare il modulo di selezione:

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

E potresti anche ottenere un risultato simile utilizzando nth-child:

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

La documentazione ha questo da dire sulla differenza tra nth-child E eq:

Mentre :eq(index) corrisponde solo a un singolo elemento, questo corrisponde a più di uno:Uno per ogni genitore con indice.Multiplo per ciascun genitore con pari, dispari o equazione.L'indice specificato ha un indice, a differenza di :eq() che inizia da zero.

Quindi facendo $('ul li').eq(19); otterresti il ​​singolo 20esimo elemento corrispondente della query (quindi se c'è più di una lista nel documento questo non ti darà "tutti i 19esimi figli", mentre $('ul li:nth-child(20)'); ti otterrebbe il ventesimo elemento dell'elenco corrispondente di ciascuno <ul> nel documento.

MODIFICARE:

Per fare qualcosa come "penultimo", il modo sensato per farlo sarebbe come:

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

Ma probabilmente dovresti fare un controllo per assicurarti che length-2 non sia inferiore a 0.

Altri suggerimenti

Vuoi il terzo dall'ultimo?

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

Spiegazione rapida: la lunghezza di $ ul (che è un oggetto jQuery) è il numero di li trovati. Quindi puoi usarlo insieme a & Quot;: eq (n) & Quot; selettore per ottenere il li nell'indice desiderato.

Ho usato Math.max nel caso in cui l'elenco fosse troppo breve (meno di 3 li).

Funzionerà anche questo, ma ovviamente non è il modo migliore:

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

Per il terzo e il ventesimo, puoi fare ul li: eq (3) e ul li: eq (20) . Dal penultimo, potresti essere in grado di fare qualcosa con nth-child " equation opzione argomento, anche se non sono sicuro.

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

Ciò avviserà il testo del terzo elemento dell'elenco.

Il team di jQuery ha aggiunto questa funzione nella versione 1.9

Puoi leggerlo a http://api.jquery.com/nth -last-figlio-selettore /

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top