Los últimos tutoriales de desarrollo web
 

jQuery De desplazamiento - Filtrado


Limitar la búsqueda para los elementos

Los tres métodos de filtrado más básicas son first(), last() y eq() , que le permite seleccionar un elemento específico en función de su posición en un grupo de elementos.

Otros métodos de filtrado, como el filter() y not() le permiten seleccionar los elementos que coinciden o no coinciden, un cierto criterio.


jQuery first() Método

El first() método devuelve el primer elemento de los elementos seleccionados.

El ejemplo siguiente selecciona el primer <p> elemento dentro de la primera <div> elemento:

Ejemplo

$(document).ready(function(){
    $("div p").first();
});
Inténtalo tú mismo "

jQuery last() Método

La last() método devuelve el último elemento de los elementos seleccionados.

En el siguiente ejemplo se selecciona el último <p> elemento dentro de la última <div> elemento:

Ejemplo

$(document).ready(function(){
    $("div p").last();
});
Inténtalo tú mismo "

jQuery eq() método

La eq() método devuelve un elemento con un número de índice específico de los elementos seleccionados.

Los números índices comienzan en 0, por lo que el primer elemento tendrá el número de índice 0 y no 1. El siguiente ejemplo selecciona la segunda <p> elemento (número de índice 1):

Ejemplo

$(document).ready(function(){
    $("p").eq(1);
});
Inténtalo tú mismo "

jQuery filter() Método

El filter() método le permite especificar un criterio. Elementos que no coinciden con los criterios se retiran de la selección, y serán devueltos los que coinciden.

El ejemplo siguiente devuelve todos los <p> elementos con nombre de clase "intro" :

Ejemplo

$(document).ready(function(){
    $("p").filter(".intro");
});
Inténtalo tú mismo "

jQuery not() Método

El not() método devuelve todos los elementos que no coinciden con los criterios.

Consejo: El not() método es lo contrario de filter() .

El ejemplo siguiente devuelve todos los <p> elementos que no tienen nombre de la clase "intro" :

Ejemplo

$(document).ready(function(){
    $("p").not(".intro");
});
Inténtalo tú mismo "

Ponte a prueba con los ejercicios!

Ejercicio 1 » Ejercicio 2» Ejercicio 3 » Ejercicio 4» Ejercicio 5 » Ejercicio 6»


jQuery desplazamiento de referencia

Para una visión completa de todos los métodos de jQuery que atraviesan, por favor vaya a nuestra jQuery desplazamiento de referencia .