HTML 内容模板(<template>
)元素是一种用于保存客户端内容机制,该内容在加载页面时不会呈现,但随后可以 (原文为 may be) 在运行时使用 JavaScript 实例化。
将模板视为一个可存储在文档中以便后续使用的内容片段。虽然解析器在加载页面时确实会处理 <template>
元素的内容,但这样做只是为了确保这些内容有效;但元素内容不会被渲染。
HTMLTemplateElement.content
属性返回 <template>
元素的模板内容(一个 DocumentFragment)。
示例:
//加载并克隆一个预定义的 HTML 模板
loadTemplate() {
const template = document.getElementById('vehicle-selector-template');
if (template) {
const templateContent = template.content.cloneNode(true);
this.appendChild(templateContent);
} else {
console.error('Template not found');
}
}