HTML <template>Tag: The HTML<template> tag holds the content hidden from the client. The <template> tag in HTML is used to store the HTML code fragments, which can be cloned and inserted in an HTML document. Use the JavaScript to get the content from a template, and add it to the web page.
HTML<template>Tag
This template tag supports both the global and the event attributes. Use the <template> tag when you have HTML code you want to use over and over again, but not until you ask for it. To do this without the <template> tag, you have to create the HTML code with JavaScript to prevent the browser from rendering the code.
Syntax: <template> Text </template>
Browser compatibility
The HTML<template> tag is supported by different types of browsers.
- Chrome-26.0
- Firefox-22.0
- Opera-15.0
- Safari-9
- InternetExplorer-13.0
Example:
<!DOCTYPE html> <html> <body> <h1>The template Tag</h1> <p>Content inside a template tag is hidden from the client.</p> <template> <h2>Flower</h2> <img src="img_white_flower.jpg" width="214" height="204"> </template> </body> </html>
Output:
The template Tag
Content inside a template tag is hidden from the client.
A later example will show you how to use JavaScript to display the template content.