<template>要素

<template>要素の定義

英語で「鋳型」や「ひな形」を表す”template”より。
ページの読み込み時にすぐには描画されないものの、後で JavaScript を使用してインスタンスを生成できる HTML を保持するメカニズムです。
テンプレートは、文書内に格納されたコンテンツの断片として扱われます。ページの読み込み時にブラウザは <template> 要素の内容を処理している間、その内容の有効性のみが検証されます。しかし、要素の内容は描画されません。

子要素として使えるもの

特に制限なし

親要素として使えるもの

メタデータコンテンツ, 記述コンテンツ, スクリプト対応要素 を受け付けるすべての要素。また、 span 属性を持たない <colgroup> 要素の子になることもできます。

許可されているARIAロール

なし

DOMインターフェース

HTMLTemplateElement

属性

グローバル属性のみが指定できます。

サンプル

See the Pen テンプレートとスロット by Masahiko Iwakiri (@m-iwakiri) on CodePen.