Explorando la función closest() en JavaScript: Encuentra el elemento más cercano en el DOM

JavaScript

Cuando se trata de encontrar relaciones entre elementos, tradicionalmente pensamos en un enfoque de arriba hacia abajo. Podemos agradecer a CSS y querySelector y querySelectorAll por esa relación en los selectores. ¿Qué pasa si queremos encontrar el padre de un elemento basado en el selector?

Para buscar el árbol de elementos y encontrar un padre por selector, puede usar el método HTMLElement de closest

// Nuestro elemento de muestra es una etiqueta "a" que coincide con ul > li > a 
const link = document.querySelector('li a');
const list = a.closest('ul');

closest busca la cadena de antepasados ​​para encontrar un elemento parent coincidente, lo contrario de los selectores de CSS tradicionales. ¡Puede proporcionar closest un selector simple o complejo para buscar!