Selecionando os primeiros itens "n" com o jQuery

217

Com o Jquery, preciso selecionar apenas os primeiros "n" itens da página, por exemplo, os primeiros 20 links, em vez de selecionar todos eles com o costume

$("a")

Parece simples, mas o manual do jQuery não tem evidências de algo assim.

jquery

— Omiod
fonte

378

Você provavelmente quer ler sobre uma fatia . Seu código será mais ou menos assim:

$("a").slice(0,20)

— istruble
fonte

65

Embora a :lt(20)abordagem pareça muito mais limpa, o uso da fatia é muito mais eficiente se você tiver um grande resultado definido para começar. Infelizmente, ao avaliar ": lt" e outros seletores de posição, o jQuery percorre todo o conjunto , mesmo que esteja apenas obtendo o primeiro elemento. Eu escrevi mais sobre isso no meu blog aqui: spadgos.com/?p=51

— nickf

1

Obrigado, um requisito paralelo do meu pedido era sobre performances, então essa é a resposta certa para mim. Obrigado aos outros por apontar o seletor: lt também.

— 830 Omiod

3

Comentário informativo por @nickf, mas o link do blog e um link gráfico não parecem funcionar

— Fractalf

1

Não é possível editar agora, desculpe - basicamente, o uso do slice foi muito mais rápido.

— nickf 29/10

92

Use o pseudo-seletor lt:

$("a:lt(n)")

Isso corresponde aos elementos anteriores ao enésimo (o enésimo elemento é excluído). A numeração começa em 0.

— kgiannakakis
fonte

13

De acordo com o jQuery Docs , o .slice é mais rápido nos navegadores modernos.

— Blaise

1

Eu gosto do uso do estilo jQuery, é mais elegante do que encadeamento.

— Fedir RYKHTIK 28/03

22

Eu encontrei esta nota no final dos documentos lt () :

Notas adicionais:
Como: lt () é uma extensão jQuery e não faz parte da especificação CSS, as consultas usando: lt () não podem tirar proveito do aumento de desempenho fornecido pelo método DOM querySelectorAll () nativo do DOM. Para um melhor desempenho em navegadores modernos, use $ ("your-pure-css-selector"). Slice (0, index).

Então use $("selector").slice(from, to)para melhores performances.

— Arlind Nushi
fonte

11

Experimente o seletor: lt: http://docs.jquery.com/Selectors/lt#index

$('a:lt(20)');

— David Hellsing
fonte

7

.slice () nem sempre é melhor. No meu caso, com o jQuery 1.7 no Chrome 36, o .slice (0, 20) falhou com o erro:

RangeError: tamanho máximo da pilha de chamadas excedido

Eu descobri que: lt (20) funcionou sem erros neste caso. Eu provavelmente tinha dezenas de milhares de elementos correspondentes.

— Kevin Gwynn
fonte

2

$("a:lt(n)")

Documentação JQuery

— hsz
fonte