HTML <template> (Content Template) Tag

❮ Previous Reference Next ❯


<button onclick="myFunction()">Show hidden template</button>

<template id="demo">
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

function myFunction() {
  let temp = document.getElementById("demo");
  let clon = temp.content.cloneNode(true);


The <template> element allow developers to declare fragments of markup which are parsed as HTML, go unused at page load, but can be instantiated later on at runtime.

The template contents are hidden implicitly since they are not part of the document.

Version: HTML5

Standard Syntax


Browser Support


Global Attributes

The <template> element also supports the Global Attributes in HTML.

Event Attributes

The <template> element also supports the Event Attributes in HTML.

Related Tags:

<content>, <shadow> and <slot>
❮ Previous Reference Next ❯