Método prevUntil() de jQuery para la navegación
Ejemplo
Buscar todos los elementos hermanos de cada elemento p que tengan la clase "selected":
$("p").siblings(".selected")
Definición y uso
siblings() obtiene los hermanos de cada elemento que coincide con la colección, el filtrado mediante selector es opcional.
Sintaxis
.siblings(selector)
| Parámetro | Descripción |
|---|---|
| selector | Valor de cadena, que contiene la expresión del selector utilizada para coincidir con los elementos. |
Explicación detallada
Si se proporciona un objeto jQuery que representa una colección de elementos DOM, el método .siblings() permite buscar elementos hermanos de estos elementos en el árbol DOM y construir un nuevo objeto jQuery con los elementos coincidentes.
Este método acepta una expresión de selector opcional, del mismo tipo de parámetro que se pasa a la función $(). Si se aplica este selector, se filtrarán los elementos mediante la detección de si coinciden con el selector.
Piensa en esta página con una lista anidada básica:
<ul> <li>elemento de lista 1</li> <li>elemento de lista 2</li> <li class="third-item">elemento de lista 3</li> <li>elemento de lista 4</li> <li>elemento de lista 5</li> </ul>
Si comenzamos desde el tercer proyecto, podemos encontrar los elementos hermanos de este elemento:
$('li.third-item').siblings().css('background-color', 'red');
El resultado de la llamada aquí es establecer el fondo de los elementos 1, 2, 4 y 5 en rojo. Establecer fondo rojo. Debido a que no se aplicó la expresión del selector, todos los elementos hermanos naturalmente se convirtieron en parte del objeto. Si se aplica un selector, solo incluirá los proyectos que coinciden de las cuatro listas.
Los elementos originales no incluyen a los elementos hermanos, es importante recordar esto cuando pretendemos encontrar todos los elementos en un nivel específico del árbol DOM.
