jQuery Traversing - Filtragem


Os métodos first(), last(), eq(), filter() e not()

Os métodos de filtragem mais básicos são first(), last()e eq(), que permitem selecionar um elemento específico com base em sua posição em um grupo de elementos.

Outros métodos de filtragem, como filter()e not()permitem que você selecione elementos que correspondam ou não a um determinado critério.


Método jQuery first()

O first()método retorna o primeiro elemento dos elementos especificados.

O exemplo a seguir seleciona o primeiro <div> elemento:

Exemplo

$(document).ready(function(){
  $("div").first();
});

Método jQuery last()

O last()método retorna o último elemento dos elementos especificados.

O exemplo a seguir seleciona o último <div> elemento:

Exemplo

$(document).ready(function(){
  $("div").last();
});


método jQuery eq()

O eq()método retorna um elemento com um número de índice específico dos elementos selecionados.

Os números de índice começam em 0, então o primeiro elemento terá o número de índice 0 e não 1. O exemplo a seguir seleciona o segundo <p>elemento (número de índice 1):

Exemplo

$(document).ready(function(){
  $("p").eq(1);
});

Método jQuery filter()

O filter()método permite especificar um critério. Os elementos que não corresponderem aos critérios serão removidos da seleção e os que corresponderem serão retornados.

O exemplo a seguir retorna todos os <p>elementos com o nome de classe "intro":

Exemplo

$(document).ready(function(){
  $("p").filter(".intro");
});

Método jQuery not()

O not()método retorna todos os elementos que não correspondem aos critérios.

Dica: O not()método é o oposto do filter().

O exemplo a seguir retorna todos os <p>elementos que não possuem o nome de classe "intro":

Exemplo

$(document).ready(function(){
  $("p").not(".intro");
});

Exercícios de jQuery

Teste-se com exercícios

Exercício:

Use um método jQuery para obter o primeiro elemento <div> no documento.

$("div").();


Referência de travessia do jQuery

Para uma visão geral completa de todos os métodos de travessia do jQuery, acesse nossa Referência de travessia do jQuery .