Méthode contains

La méthode contains permet de vérifier si un élément en contient un autre. Le paramètre de la méthode est l'élément qui sera vérifié pour s'assurer qu'il se trouve à l'intérieur de l'élément sur lequel la méthode a été appliquée.

Syntaxe

javascriptparent.contains(élément);

Exemple

Vérifions si le paragraphe #child se trouve dans le bloc #parent :

html<div id="parent">
  <p id="child"></p>
</div>
javascriptlet parent = document.querySelector('#parent');
let child = document.querySelector('#child');

let contains = parent.contains(child);
console.log(contains);

Résultat de l'exécution du code :

javascripttrue

Exemple

Et maintenant, le parent ne contient pas l'élément transmis et donc la méthode retourne false :

html<div id="parent"></div>
<p id="child"></p>
javascriptlet parent = document.querySelector('#parent');
let child = document.querySelector('#child');

let contains = parent.contains(child);
console.log(contains);

Résultat de l'exécution du code :

javascriptfalse

Exemple

On peut passer le même élément sur lequel la méthode a été appelée, dans ce cas la méthode retournera également true :

html<div id="parent"></div>
javascriptlet parent = document.querySelector('#parent');
let contains = parent.contains(parent);

console.log(contains);

Résultat de l'exécution du code :

javascripttrue

Voir aussi

  • la méthode matches,
    qui vérifie un élément par sélecteur
  • la méthode closest,
    qui trouve un parent par sélecteur