HTML Tutorial
HTML Attributes
- html-global-attributes
- html-event-attributes
HTML Tags List
HTML5 Advance
HTML API
HTML Color Names
- html-color-names
HTML Misc
MCQ
- html-mcq
Interview Questions
- html-interview-questions

HTML

The content of the template will not be displayed until it is not activated using JavaScript. The browser processes the content of the

It can also be useful when you want to use same content multiple times in your HTML document without any change.

The

Syntax

Following are some specifications about the HTML

Display	None
Start tag/End tag	Start and End tag
Usage	Formatting

Example

<!DOCTYPE html>
<html>
<head>
<title>HTML Template tag</title>
<style>
body{
  background-color: #e6e6fa;
}
</style>
</head>
<body>
  <h2>Example of template tag</h2>
  <button onclick="clickMe()">Click Me</button><br>
  
 <template id="mytemplate">
   <img src="bird.jpg" alt="bird's image" height="100" width="100">
   <script>
   alert("Thank you for choosing template. Click OK for image.")
   </script>
  </template>

<script>
   function clickMe() {
    var x= document.getElementsByTagName("template")[0];
    var clon = x.content.cloneNode(true);
    document.body.appendChild(clon);}
</script>
</body>
</html>

Test it Now

Output: