<template>
| 対応ブラウザ | Chrome 26～ / Firefox 22.0～ / Opera 15.0～ / Android 4.4～ | ||
|---|---|---|---|
| タグの分類 |
メタデータ・コンテンツ フロー・コンテンツ フレージング・コンテンツ スクリプトサポート要素 |
含められるもの |
下記のいずれかが含められるものと同じ
|
| 使える場所 |
メタデータ・コンテンツを使える場所 フレージング・コンテンツを使える場所 スクリプトサポート要素を使える場所 span属性を持たない<colgroup>要素の子要素として |
||
| 用例 |
<table> <tr> <th>書名</th><th>作者</th><th>出版社</th><th>発行年月日</th><th>ISBNコード</th> </tr> <template id="row"> <tr> <td></td><td></td><td></td><td></td><td></td> </tr> </template> </table> |
||
<template>とは
「template」とは、スクリプトから利用されるHTMLの一部を記述するために使用するタグです。<template>～</template>の間に書かれた内容は、そのままでは表示されません。
HTM4までは、ページの一部をAjaxで取得して文書へ追加する際など、マークアップはスクリプト側に埋め込むしかありませんでした。<template>タグを使うことで、文書がロードされた時点では使われず、スクリプトによって後から動的に追加する内容のマークアップを、文書側の実際に使われる場所へ記述することができます。
スクリプトによって有効化されるまで、<template>の内容は文書の一部とはみなされません。たとえば<form>の中に<input>を含む<template>を書き、フォームがsubmitされた場合、その<template>内の<input>は<template>が有効化されていない限り送信されません。
