京东云服务器推荐配置、多种配置选择,满足不同业务需求!

热门推荐

⭐ 稳定入门选择

配置:2核2G/5M

适用场景:个人站点 / 轻量应用

特点:性价比高,稳定可靠

¥19/月
立即购买
流量友好

☁️ 轻量云主机

配置:2核4G 5M

适用场景:小型业务 / 博客 / 测试环境

特点:流量友好,性能均衡

¥149/年
立即购买
高性能

💻 云服务主机

配置:4核16G 8M

适用场景:中小型服务 / 多并发场景

特点:充足内存与带宽,性能强劲

¥750/年
立即购买
新人专享

🎁 新人福利

新人访问 → 点击 → 最新活动

可获取 3000元 礼券

立即领取
参考手册 / HTML 参考手册 / HTML 标签大全
HTML: <template> 标签
HTML: <wbr> 标签

HTML: <template> 标签

HTML内容模板( <template>)元素是一种用于保存客户端内容机制,该内容在加载页面时不会呈现,但随后可以(原文为 may be)在运行时使用JavaScript实例化。 将模板视为一个可存储在文档中以便后续使用的内容片段。虽然解析器在加载页面时确实会处理 <template>元素的内容,但这样做只是为了确保这些内容有效;但元素内容不会被渲染。

在线示例

示范如何使用template标签:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML template标签的使用(菜鸟教程 (xsc123.com))</title>
</head>
<body>
<p>Content inside a template tag is hidden from the client.</p>
<template>
  <h2>Views</h2>
  <img src="views.png">
</template>
<p>A later example will show you how to use JavaScript to display the template content.</p>
</body>
</html>
测试看看 ‹/›

浏览器兼容性

IEFirefoxOperaChromeSafari

所有主流浏览器都支持 <template> 标签。

定义和用法

<template>标记将其内容从客户端隐藏起来。

<template>标记内的内容将不会呈现。

以后可以使用JavaScript使内容可见并呈现。

当您有要一遍又一遍地使用HTML代码时,请使用<template>标记,但是直到您要使用它时才使用。要在没有 <template>标记的情况下执行此操作,必须使用JavaScript创建HTML代码,以防止浏览器呈现代码。

更多在线示例

<!DOCTYPE html>
<html>
<body>
<h1>HTML template标签的使用(菜鸟教程 (xsc123.com))</h1>
<p>Click the button to get the content from a template, and display it in the web page.</p>
<button onclick="showContent()">Show content</button>
<template>
  <h2>views</h2>
  <img src="views.png" width="300" height="204">
</template>
<script>
function showContent() {
  var temp = document.getElementsByTagName("template")[0];
  var clon = temp.content.cloneNode(true);
  document.body.appendChild(clon);
}
</script>
</body>
</html>
测试看看 ‹/›

HTML 4.01和HTML5之间的差异

<template>标签是HTML5中的新标签。

全局属性

<template> 标签支持 HTML 的全局属性。

事件属性

<template> 标签支持 HTML 的事件属性。

HTML: <wbr> 标签
上一篇:HTML: <wbr> 标签
下一篇:无