HTML Tag Reference

shadowrootmode 属性

宣言型 Shadow root（シャドウルート）とする

shadowrootmode 属性は、template 要素に付与することで、宣言型 Shadow root（シャドウルート）とします。

属性値として指定できる値は下記の通りです。

値 概要
open template 要素は、オープンな宣言型 Shadow root を表します。Shadow root 要素には、例えば Element.shadowRoot を使用して、ルート外の JavaScript からアクセスできます。
closed template 要素は、閉じた宣言型 Shadow root を表します。外部からのアクセスを防ぎ、Shadow root 要素をカプセル化します。

なお、shadowrootmode 属性の値が不正、もしくは空の場合、どちらも shadowrootmode 属性が付与されていないものとして扱われます。

shadowrootmode 属性の仕様

この属性を使用できる要素

shadowrootmode 属性のサンプルソース

<template shadowrootmode="open">
  <style>h2 { color: blue; }</style>
  <h2>shadow content</h2>
</template>

用途から目的の要素を探す

用途から HTML 要素を逆引きできます。