<template> tag in HTML

← Previous Next →

The <template> tag holds the client-side content that will not render when a page is loaded and the browser ignores the contents, it only checks for syntax validity but the content can be made visible and rendered later by using JavaScript.

Important Description

• The <template> tag is new in HTML5.
• Open and close tag required of <template>.

Example of <template> tag

<p>Click the below button to get the result from a template.</p> <button onclick="showContent()">Click Here & Show Content</button> <template> <h3>Planets</h3> <img src="planets.jpg" width="300" height="300" /> </template> <script> function showContent() { var temp = document.getElementsByTagName("template")[0]; var clon = temp.content.cloneNode(true); document.body.appendChild(clon); } </script>

<template> Tag Browser Support

Global Attributes

• The <template> tag supports all the Global Attributes in HTML.

← Previous Next →