先上一个demo,简单粗暴,请自便

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
*{
margin: 0px;
padding: 0px;
}
</style>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body> <script type="text/template" id="unit_temple">
这里是模版
<div>你好</div>
</script>
<div id="content">hi</div> <script type="text/javascript">
$("#content").html($("#unit_temple").html());
</script>
</body>
</html>

这里定义了一个渲染的模板,在最初看html <script>标签的type属性的时候只看到了如下几个值,固定思维的以为就只能用下面的几个值了,其实type这个值是可以更改的,就如上面的那个demo了,

<script type="text/template" id="unit_temple">
语法
<script type="value">
属性值
值 描述
MIME_type
MIME 类型。其中一些值:
text/javascript
text/ecmascript
application/ecmascript
application/javascript
text/vbscript

这里为什么用script标签呢,用script标签的好处是默认不会显示在页面上,而且可以放置除script标签以外所有的标签,模板一般不会出现scrtipt标签,总结一下就是script 标签的type可以随意定义, 但是要看支持的东西,比如React用的 jsx 就用的是 text/jsx。

关于MVC模板渲染的一点小事type="text/template"的更多相关文章

  1. 前端模板<script type="text/template" id="tmpl">

    前端模板, 比连接字符串好用多了, 还可以使用循环\判断等语句, 减少工作量 <script type="text/template" id="member-tmp ...

  2. <script type="text/template">是干什么的,为什么要把html写在js中? 这是什么编程语言风格,都能这样用吗?

    这一段存放了一个模板.在js里面,经常需要使用js往页面中插入html内容.比如这样: var number = 123; $('#d').append('<div class="t& ...

  3. 关于 <script type='text/template' > 的妙用 / 使用jquery获取iframe加载完成事件

    https://www.cnblogs.com/ddqyc/p/6200539.html <!DOCTYPE html> <html> <head> <met ...

  4. Js script type="text/template"的使用简单说明

    <script type="text/template" id="treeTableTpl"> <tr id="{{row.id}} ...

  5. JavaScript type="text/template"的用法

    JavaScript type="text/template"相当于定义一个模板,如果没有使用html()方法的话,是显示不出来的,我们直接看例子(我是在tp框架的里面写的) &l ...

  6. mustache模板渲染的基本原理

    mustache.js是一个模板引擎,为开发节省了大量的“人力”,对于初学者,我是从这篇 和这篇 博客接触的,算是对mustache有了初步认识,不得不承认自己还是菜鸟阶段还有太多东西要学,慢慢熟悉. ...

  7. <script type="text/x-template"> 模板

    获取动态的js模板可以用art-template插件 <script type="text/template"> 给<script>设置type=" ...

  8. JS数据模板分离(告别字符串拼接)-template

    刚开始在写第一个动态网页的demo时,由于html不多,便使用字符串拼接的方法添加到dom来渲染,可是在后来写某外卖app时也需要如此添加,打开代码一看几千行,突然感觉累觉不爱 一行行的拼接有这功夫别 ...

  9. JS的type类型为 text/template

    JS标签中有时候会看见<script type="text/tmplate" >,大概就是一个放置模板的地方,而这些东西并不显示在页面 在js里面,经常需要使用js往页 ...

随机推荐

  1. jsp中jquery用法一步刷新 验证用户名是否存在

    <script type="text/javascript"> /* $(document).ready(function(){ var id="ha&quo ...

  2. Android开发人员不得不收集的代码(转)

    App相关→AppUtils.java 安装App installApp 卸载指定包名的App uninstallApp 获取当前App信息 getAppInfo 获取所有已安装App信息 getAl ...

  3. Freebsd的ports命令

    安装 make clean 卸载 make deinstall 重装 make reinstall 清理 make clean 列出配置单 make config 恢复默认的配置单 make rmco ...

  4. Spring Resource框架体系介绍

    Resource介绍 在使用spring作为容器进行项目开发中会有很多的配置文件,这些配置文件都是通过Spring的Resource接口来实现加载,但是,Resource对于所有低级资源的访问都不够充 ...

  5. sqlserver中的时间比较

    例子: select count(*) from table where DATEDIFF ([second], '2004-09-18 00:00:18', '2004-09-18 00:00:19 ...

  6. 渐变背景(background)效果

    chrom and Safari浏览器: webkit核心的浏览器.使用CSS3渐变方法(css-gradient) -webkit-gradient(type, start_point, end_p ...

  7. php解码“&#”编码的中文用函数html_entity_decode()

    遇到类似 ' 这种编码的字,我们可以用html_entity_decode()函数来解码. html_entity_decode() 函数把 HTML 实体转换为字符. 语法 html_entity_ ...

  8. golang生成随机函数的实现

    golang生成随机数可以使用math/rand包, 示例如下: package main import ( "fmt" "math/rand" ) func ...

  9. JQ动态获取数据

    转:JQUERY获取浏览器窗口的高度和宽度 June 27, 2012 <script type="text/javascript"> $(document).read ...

  10. 09-redis事务及锁应用

    Redis 中的事务 Redis支持简单的事务 Redis与 mysql事务的对比 ------------------------------------------------------- My ...