Método parents() de jQuery para recorrer
Definición y uso
La función parents() obtiene los elementos ancestor de cada elemento en la colección de elementos coincidentes, la selección de selector es opcional.
.parents()selector)
| Parámetro | Descripción |
|---|---|
| selector | Valor de cadena que contiene la expresión de selector utilizada para coincidir con los elementos. |
Descripción detallada
Si se proporciona un objeto jQuery que representa una colección de elementos DOM, el método .parents() permite buscar elementos ascendientes de estos elementos en el árbol DOM y construir un nuevo objeto jQuery con elementos coincidentes ordenados desde el elemento padre más cercano hacia arriba. Los elementos se devuelven en orden desde el padre más cercano hacia afuera. .parents() y .parent() El método es similar, pero el último recorre un único nivel en el árbol DOM.
Este método acepta una expresión de selector opcional, del mismo tipo que los parámetros pasados a la función $(). Si se aplica este selector, se filtrarán los elementos mediante la verificación de si coinciden con el selector.
Pensar en esta página con una lista anidada básica:
<ul class="level-1">
<li class="item-i">I</li>
<li class="item-ii">II
<ul class="level-2">
<li class="item-a">A</li>
<li class="item-b">B
<ul class="level-3">
<li class="item-1">1</li>
<li class="item-2">2</li>
<li class="item-3">3</li>
</ul>
</li>
<li class="item-c">C</li>
</ul>
</li>
<li class="item-iii">III</li>
</ul>
Si comenzamos con el elemento A, podemos encontrar sus elementos ascendientes:
$('li.item-a').parents().css('background-color', 'red');
El resultado de esta llamada es que se establece el fondo rojo para los elementos como la lista de nivel-2, el elemento II y la lista de nivel-1 (hasta <html> en el árbol DOM). Dado que no hemos aplicado una expresión de selector, el elemento padre se convierte naturalmente en parte del objeto. Si se aplica un selector, se verificará si el elemento coincide con el selector antes de que se incluya el elemento. Dado que no hemos aplicado una expresión de selector, todos los elementos ascendientes son parte del objeto jQuery devuelto. Si se aplica un selector, solo se incluirán los elementos que coincidan con él.
