- Mastering Angular Components
- Gion Kunz
- 211字
- 2021-07-23 17:23:38
Template elements
Template elements allow you to define regions within your HTML, which will not be rendered by the browser. You can then instantiate these document fragments with JavaScript and then place the resulting DOM within your document.
While the browser is actually parsing the template content, it only does so in order to validate the HTML. Any immediate actions that the parser would usually execute will not be taken. Within the content of template elements, images will not be loaded and scripts won't be executed. Only after a template is instantiated will the parser take the necessary actions, as follows:
<body>
<template id="template">
<h1>This is a template!</h1>
</template>
</body>
This simple HTML example of a template element won't display the heading on your page. As the heading is inside a template element, we first need to instantiate the template and add the resulting DOM into our document:
var template = document.querySelector('#template');
var instance = document.importNode(template.content, true);
document.body.appendChild(instance);
Using these three lines of JavaScript, we can instantiate the template and append it into our document.
- 解析QUIC/HTTP3:未來互聯網的基石
- C++黑客編程揭秘與防范
- INSTANT PhpStorm Starter
- 網絡故障現場處理實踐(第4版)
- TCP/IP入門經典(第5版)
- Hands-On Full Stack Development with Spring Boot 2 and React(Second Edition)
- Practical Web Design
- 大話社交網絡
- VMware NSX網絡虛擬化入門
- 4G小基站系統原理、組網及應用
- 5G+區塊鏈
- 互聯網安全的40個智慧洞見(2016)
- 物聯網技術與實踐
- ElasticSearch Server
- 網絡分析技術揭秘:原理、實踐與WinPcap深入解析