Méthode closest
La méthode closest recherche l'élément parent
le plus proche correspondant au sélecteur CSS spécifié,
l'élément lui-même étant également inclus dans la recherche.
Syntaxe
élément.closest('sélecteur');
Exemple
Cherchons parmi les parents de l'élément un élément
avec la classe www :
<div class="www" id="parent2">
<div class="ggg" id="parent1">
<p class="zzz" id="child"></p>
</div>
</div>
let elem = document.querySelector('#child');
let parent = elem.closest('.www');
console.log(parent.id);
Résultat de l'exécution du code :
'parent2'
Exemple
Cherchons parmi les parents de l'élément un élément
avec la classe www. Nous obtiendrons ainsi
une référence à l'élément lui-même, car il possède
lui-même cette classe :
<div class="www" id="parent2">
<div class="www" id="parent1">
<p class="www" id="child"></p>
</div>
</div>
let elem = document.querySelector('#child');
let parent = elem.closest('.www');
console.log(parent.id);
Résultat de l'exécution du code :
'child'