método jQuery padres()

❮ Métodos transversales de jQuery

Ejemplo

Devuelve todos los elementos antecesores de <span>:

$(document).ready(function(){
  $("span").parents().css({"color": "red", "border": "2px solid red"});
});

Resultado:

body (great-great-grandparent)
div (great-grandparent)
    ul (grandparent)
  • li (direct parent) span

Definición y uso

El método parent() devuelve todos los elementos antecesores del elemento seleccionado.

Un antepasado es un padre, un abuelo, un bisabuelo, etc.

El árbol DOM: este método atraviesa hacia arriba desde el elemento principal a lo largo de los ancestros de los elementos DOM, hasta el elemento raíz del documento (<html>).

Nota: si el parámetro de filtro está vacío, esta función seleccionará todos los ancestros de un conjunto de elementos, desde el padre directo hasta <body> y <html>. Por lo tanto, a menudo es útil pasar una expresión de selector para limitar el resultado de la búsqueda.

Este método es similar al más cercano () , en el sentido de que ambos atraviesan el árbol DOM. Las diferencias son las siguientes:

padres()

  • Comienza con el elemento padre
  • Viaja hacia arriba en el árbol DOM y devuelve todos los ancestros que coinciden con la expresión pasada
  • El objeto jQuery devuelto contiene cero o más de un elemento

más cercano()

  • Comienza con el elemento actual
  • Viaja hacia arriba en el árbol DOM y devuelve el primer ancestro que coincide con la expresión pasada
  • El objeto jQuery devuelto contiene cero o un elemento

Otros métodos relacionados:

  • parent() - devuelve el elemento padre directo del elemento seleccionado
  • parentUntil() - devuelve todos los elementos antecesores entre dos argumentos dados


Sintaxis

$(selector).parents(filter)

Parameter Description
filter Optional. Specifies a selector expression to narrow down the search for ancestors

Note: To return multiple ancestors, separate each expression with a comma.

Pruébelo usted mismo - Ejemplos


Cómo usar el parámetro de filtro para devolver todos los ancestros de <span> que son elementos <ul>.


Cómo usar el parámetro de filtro para devolver todos los antepasados ​​de <span> que son elementos <li> y <div>.


Una demostración que muestra quiénes son realmente los ancestros de un elemento <span>.


❮ Métodos transversales de jQuery