HTML <template>标签,容纳隐藏内容
<template>标签
<template>是一个容器,用于容纳那些在页面加载时被隐藏的HTML元素,如果需要将其呈现给浏览器端的用户,可以使用JavaScript来操作。template为块元素,包含起始标签和结束标签。
<template></template>
<template>标签实例代码,及在线编辑器
<div id='d1'>
<button onclick='showTemplate()'>显示隐藏的template</button>
<template id='t1'>
<p>这是包含在template中的元素p,运行之后,该内容表现为隐藏,当点击按钮时,该内容将通过JavaScript来呈现。</p>
</template>
</div>
<script>
function showTemplate() {
var t = document.getElementById("t1");
var c = t.content.cloneNode(true);
document.getElementById('d1').appendChild(c);
}
</script>