shadowrootmode HTML attribuut
1 element kent dit attribuut. Klik op een tag voor de volledige uitleg van dat element.
Wat doet het shadowrootmode attribuut?
Verplicht attribuut om Declarative Shadow DOM te activeren: de waarde "open" of "closed" komt overeen met de mode-parameter van attachShadow(). Zonder dit attribuut blijft de <template> een gewone, inerte template.
<div id="host">
<template shadowrootmode="open">
<p>Deze inhoud wordt direct een shadow root</p>
</template>
</div>Welke HTML-elementen kennen shadowrootmode?
<template>
Het <template>-element van HTML dient als een mechanisme om HTML-fragmenten vast te houden, die later kunnen worden gebruikt via JavaScript...
Creëert een shadow root voor het bovenliggende element.
Dit is een declaratieve versie van de methode Element.attachShadow() en accepteert dezelfde opgesomde waarden.
-
open- : Maakt de interne shadow-root-DOM toegankelijk voor JavaScript (aanbevolen voor de meeste toepassingen).
-
closed- : Verbergt de interne shadow-root-DOM voor JavaScript.
De HTML-parser maakt een ShadowRoot-object in de DOM voor het eerste <template>-element in een node waarop dit attribuut is ingesteld op een toegestane waarde.
Als het attribuut niet is ingesteld, of niet is ingesteld op een toegestane waarde — of als er al declaratief een ShadowRoot is aangemaakt in dezelfde ouder — dan wordt een HTMLTemplateElement geconstrueerd.
Een HTMLTemplateElement kan na het parsen niet meer worden omgezet in een shadow root, bijvoorbeeld door HTMLTemplateElement.shadowRootMode in te stellen.
U kunt het niet-standaard attribuut shadowroot tegenkomen in oudere tutorials en voorbeelden, dat vroeger werd ondersteund in Chrome 90-110. Dit attribuut is sindsdien verwijderd en vervangen door het standaardattribuut shadowrootmode.