ShadowRoot.mode

Baseline Large disponibilité

Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis janvier 2020.

La propriété mode, rattachée à l'interface ShadowRoot, indique son mode. Celui-ci peut valoir open ou closed et indique si les fonctionnalités internes de la racine sont accessibles en JavaScript.

Lorsque le mode d'une racine shadow vaut closed, les détails d'implémentation internes sont inaccessibles et inchangeables avec JavaScript (de la même façon que les détails du fonctionnement de l'élément <video> sont inaccessibles et inchangeables en JavaScript).

js
let customElem = document.querySelector("mon-element-shadow-dom");
let shadow = customElem.shadowRoot;

// Une autre façon de vérifier si la racine est ouverte :
// on obtiendra null si elle est fermée
if (shadow) {
  // Si elle est ouverte, on ferme la racine pour
  // cacher ce qu'il y a à l'intérieur.
  shadow.mode = "closed";
}