Selecione Nth irmão anterior em jQuery?

StackOverflow https://stackoverflow.com/questions/1022595

  •  06-07-2019
  •  | 
  •  

Pergunta

Eu estou tentando configurar meu seletor jQuery, mas eu não sei exatamente como eu preciso escrevê-lo.

Eu tenho uma lista não ordenada, que é algo como isto: 

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

Agora eu sei que se eu quiser selecionar o último filho eu posso fazer isso usando um "ul li.last" ou "ul.li:last", mas dizem que se eu queria o segundo do último, ou terceiro, ou 20 ? Agora que eu faria isso?

Foi útil?

Solução

Você pode usar eq : 

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

Onde X é um índice baseado em 0 de qual elemento você quer. Você também pode usar o forma selector : 

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

E você também pode conseguir um resultado semelhante usando nth-child : 

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

A documentação tem a dizer sobre a diferença entre nth-child e eq:

Enquanto: eq (índice) corresponde apenas a um único elemento, isto combina mais de um: um para cada um dos pais com índice. Múltiplo para cada um dos pais com par, ímpar, ou equação. O índice especificado é uma indexada, em contraste com: Eq. (), Que se inicia em zero

Então, fazendo $('ul li').eq(19); você terá a única 20º elemento correspondente da consulta (por isso, se há mais de uma lista no documento isso não vai tirar você "todas as crianças 19", enquanto $('ul li:nth-child(20)'); que você começa a 20ª indivíduo elemento correspondente lista de cada <ul> no documento.

Editar :

Para fazer algo como "segundo a última", a maneira sensata de fazê-lo seria como: 

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

Mas você provavelmente deve fazer uma verificação para se certificar de comprimento-2 não é inferior a 0.

Outras dicas

Você quer o terceiro do último? 

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

Breve explicação: O comprimento $ ul (que é um objeto jQuery) é a forma como muitos de Li são encontrados. Então você pode usar isso junto com o. ": Eq (n)" selector para obter a li no índice desejado

Eu costumava Math.max no caso, a lista era muito curto (menos de 3 de li).

Este também funcionará, mas obviamente não é a melhor maneira: 

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

Para terceira e XX, você pode fazer ul li:eq(3) e ul li:eq(20). Para segundo a última, você pode ser capaz de fazer algo com nth-child 's equation opção argumento, embora eu não tenho certeza. 

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

Isso vai alertar o texto do terceiro item da lista.

O time jQuery adicionado esse recurso na versão 1.9

Você pode ler sobre ele em http://api.jquery.com/nth -última-criança-selector /

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top