Métodos de desplazamiento <jQuery
Ejemplo
Devolver el primer antepasado de <span> , que es un <ul> elemento:
$(document).ready(function(){
$("span").closest("ul").css({"color": "red", "border": "2px
solid red"});
});
Resultado:
body (great-great-grandparent)
div (great-grandparent)
ul (second ancestor - second grandparent) ul (first ancestor -
first grandparent) - li (direct parent) span
Inténtalo tú mismo " Definición y Uso
El closest() método devuelve el primer antepasado del elemento seleccionado.
Un antepasado es un padre, abuelo, bisabuelo, y así sucesivamente.
El árbol DOM: Este método de desplazamiento hacia arriba desde el elemento actual, todo el camino hasta el elemento raíz del documento (<html>) , para encontrar el primer antepasado de los elementos DOM.
Este método es similar a parents() , en que ambos atraviesan el árbol DOM. Las diferencias son las siguientes:
closest()
- Comienza con el elemento actual
- Viaja por el árbol DOM y devuelve el primer antepasado (individual) que coincide con la expresión pasada
- El objeto jQuery devuelta contiene cero o un elemento
parents()
- Comienza con el elemento padre
- Viaja por el árbol DOM y devuelve todos los antepasados que coincide con la expresión pasada
- El objeto jQuery devuelto contiene cero o más de un elemento
Otros métodos relacionados:
- parent() - devuelve el elemento de matriz directa del elemento seleccionado
- parentsUntil() - devuelve todos los elementos antecesores entre dos argumentos dados
Sintaxis
Devolver el primer antepasado del elemento seleccionado:
$(selector).closest( filter )
Devolver el primer antepasado usando un contexto DOM para buscar el árbol DOM dentro:
$(selector).closest( filter,context )
Parámetro | Descripción |
---|---|
filter | Necesario. Especifica una expresión de selección, elemento u objeto jQuery para limitar la búsqueda ancestro |
context | Opcional. Un elemento DOM dentro de la cual se puede encontrar un elemento coincidente |
Inténtelo usted mismo - Ejemplos
Devuelve el primer antepasado de <span> , que es un <span> elemento
Debido a que este método comienza con el elemento actual, una búsqueda de la primera <span> de <span> , volverá <span> .
Pasar de un elemento DOM como el contexto en el que para buscar el primer elemento antecesor
El uso de ambos parámetros a pasar en un elemento DOM como el contexto en el que la búsqueda de la primera <ul> elemento.