diff options
Diffstat (limited to 'files/fr/web/api/shadowroot/mode/index.html')
-rw-r--r-- | files/fr/web/api/shadowroot/mode/index.html | 63 |
1 files changed, 63 insertions, 0 deletions
diff --git a/files/fr/web/api/shadowroot/mode/index.html b/files/fr/web/api/shadowroot/mode/index.html new file mode 100644 index 0000000000..f9e3ac0ccd --- /dev/null +++ b/files/fr/web/api/shadowroot/mode/index.html @@ -0,0 +1,63 @@ +--- +title: ShadowRoot.mode +slug: Web/API/ShadowRoot/mode +tags: + - API + - Propriété + - Reference + - ShadowRoot + - mode + - shadow dom +translation_of: Web/API/ShadowRoot/mode +--- +<div>{{APIRef("Shadow DOM")}}</div> + +<p>La propriété <strong><code>mode</code></strong>, rattachée à l'interface {{domxref("ShadowRoot")}}, indique son mode. Celui-ci peut valoir <code>open</code> ou <code>closed</code> et indique si les fonctionnalités internes de la racine sont accessibles en JavaScript.</p> + +<p>Lorsque le mode d'une racine <em>shadow</em> vaut <code>closed</code>, 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 {{HTMLElement("video")}} sont inaccessibles et inchangeables en JavaScript).</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var <em>mode</em> = <em>shadowRoot</em>.mode</pre> + +<h3 id="Valeur">Valeur</h3> + +<p>Une valeur définie via l'énumération <code><a href="https://dom.spec.whatwg.org/#enumdef-shadowrootmode">ShadowRootMode</a></code> : soit <code>open</code>, soit <code>closed</code>.</p> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: 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'; +}</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('DOM WHATWG','#dom-shadowroot-mode','ShadowRoot.mode')}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une <em>pull request</em>.</div> + +<p>{{Compat("api.ShadowRoot.mode")}}</p> |