先上一个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. C++必知必会(1)

    条款1数据抽象 抽象数据类型的用途在于将变成语言扩展到一个特定的问题领域.一般对抽象数据类型的定义须要准训下面步骤: 1.     为类型取一个描写叙述性的名字 2.     列出类型所能运行的操作 ...

  2. Iowait的成因、对系统影响及对策

    什么是iowait?顾名思义,就是系统因为io导致的进程wait.再深一点讲就是:这时候系统在做io,导致没有进程在干活,cpu在执行idle进程空转,所以说iowait的产生要满足两个条件,一是进程 ...

  3. 如何利用hibernate3解决数据库丢失更新问题?

    首先我们要明白什么叫丢失更新. 比如数据库有一个person表,里面有一条这样的数据 "5 zhangsan shenzhen"; 现在有两个事务A.B同时查找了这一条记录: A事 ...

  4. linux查看某个时间段的log

    若想在linux下查询某个时间段的log,用sed命令示例如下: $ sed -n '/2017-01-04 11:00:00/,/2017-01-04 11:20:55/p'  ejabberd.l ...

  5. Socket的UDP协议在erlang中的实现

    现在我们看看UDP协议(User Datagram Protocol,用户数据报协议).使用UDP,互联网上的机器之间可以互相发送小段的数据,叫做数据报.UDP数据报是不可靠的,这意味着如果客户端发送 ...

  6. Oracle 10g ORA-12154: TNS: could not resolve the connect identifier specified 问题解决! 我同事遇到的问题。 username/

    Oracle 10g ORA-12154: TNS: could not resolve the connect identifier specified 问题解决! 我同事遇到的问题. userna ...

  7. 兔子的晚会 2016Vijos省选集训 day1

    兔子的晚会 (xor.c/pas/cpp)============================= 很久很久之前,兔子王国里居住着一群兔子.每到新年,兔子国王和他的守卫总是去现场参加晚会来欢庆新年. ...

  8. 【BZOJ2096】[Poi2010]Pilots 双指针+单调队列

    [BZOJ2096][Poi2010]Pilots Description Tz又耍畸形了!!他要当飞行员,他拿到了一个飞行员测试难度序列,他设定了一个难度差的最大值,在序列中他想找到一个最长的子串, ...

  9. 【WinForm】创建自定义控件(转)

    转自:http://www.cnblogs.com/bomo/archive/2012/12/09/2810559.html 虽然VS为我们提供了很多控件可以使用,但有时候这些控件仍然不能满足我们的要 ...

  10. OCR光学字符识别--STN-OCR 测试

    1.同文章中建议的使用ubuntu-python隔离环境,真的很好用 参照:http://blog.topspeedsnail.com/archives/5618启动虚拟环境:source env/b ...