jQuery Recorrido -Ancestros

Los ancestros son el padre, el abuelo, el bisabuelo, etc.

Con jQuery, puede recorrer hacia arriba el árbol DOM para encontrar los ancestros de un elemento.

Recorrer hacia arriba el árbol DOM

Estos métodos de jQuery son útiles; se utilizan para recorrer hacia arriba el árbol DOM:

El método parent() devuelve el elemento padre directo del elemento seleccionado.

Este método solo recorre un nivel hacia arriba en el árbol DOM.

El siguiente ejemplo devuelve el elemento padre directo de cada elemento <span>:

$(document).ready(function(){ $("span").parent(); });

El método parents() devuelve todos los elementos ancestros del elemento seleccionado, ascendiendo hasta el elemento raíz del documento (<html>).

El siguiente ejemplo devuelve todos los ancestros de todos los elementos <span>:

$(document).ready(function(){ $("span").parents(); });

También puede utilizar un parámetro opcional para filtrar la búsqueda de elementos ancestros.

El siguiente ejemplo devuelve todos los ancestros de todos los elementos <span> que además son elementos <ul>:

$(document).ready(function(){ $("span").parents("ul"); });

El método parentsUntil() devuelve todos los elementos ancestros que se encuentran entre dos elementos dados.

El siguiente ejemplo devuelve todos los elementos ancestros entre los elementos <span> y <div>:

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

Otras extensiones