问题的提出:

我们为什么非得要引入artTemplate来进行JSON数据的渲染呢?

好了,我引入它还不行吗?

我们在项目中引入了artTemplate来解决服务器端返回json数据,由前端JS负责进行页面渲染的问题。

但由此引发了新的问题,就是artTemplate的模板如何实现重用?如果解决不了的话,那么就是一个HTML页写一次模板,不可能实现改一个地方,所以相关的东西都能修改的要求。

比如:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>include-demo</title>
<script src="../dist/template.js"></script>
</head> <body>
<div id="content"></div>
<script id="test" type="text/html">
<h1>{{title}}</h1>
{{include 'list'}}
</script>
<script id="list" type="text/html">
<ul>
{{each list as value i}}
<li>索引 {{i + }} :{{value}}</li>
{{/each}}
</ul>
</script> <script>
var data = {
title: '嵌入子模板',
list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
};
var html = template('test', data);
document.getElementById('content').innerHTML = html;
</script>
</body>
</html>

如何将一个HTML页面嵌套在另一个页面中

http://www.cnblogs.com/saptechnique/archive/2012/08/28/2660403.html

噢,原来shtml是这样的东东啊,那我们使用的是Nginx,这个东西一定是支持shtml的吧?

Nginx SSI 设置

http://iqbon.iteye.com/blog/1882319

http://blog.csdn.net/qmhball/article/details/8778201

Tomcat中的SSI配置是这样的:

黄海测试通过的文件下载

http://www.cnblogs.com/qzsonline/archive/2012/01/06/2314035.html

http://blog.csdn.net/silentbalanceyh/article/details/3444239

如何实现artTemplate模板的可重用性,以此框架打造自己的自定义组件的更多相关文章

  1. directorjs和requirejs和artTemplate模板引擒建立的SPA框架

    分为4块:A : index.html壳子.    加载B  init-config.js,   加载D  header.html模板B : init-config.js 个人信息+路由配置+权限+渲 ...

  2. artTemplate模板引擎学习实战

    在我的一篇关于智能搜索框异步加载数据的文章中,有博友给我留言,认为我手写字符串拼接效率过低,容易出错.在经过一段时间的摸索和学习之后,发现现在拼接字符串的方法都不在是自己去书写了,而是使用Javasc ...

  3. artTemplate模板引擎

    artTemplate模板引擎         <li>索引 {{i + 1}} :{{value}}</li>     {{/each}} </ul> </ ...

  4. Java使用泛型类来提高方法的可重用性

    我的技术博客经常被流氓网站恶意爬取转载.请移步原文:http://www.cnblogs.com/hamhog/p/3832268.html,享受整齐的排版.有效的链接.正确的代码缩进.更好的阅读体验 ...

  5. Class撑起了OOP世界的天。Class类是OO的基本单元,OO的世界都是通过一个一个的类协作完成的,提高软件的重用性、灵活性和扩展性(转)

    引言 在OO的工作中,我们一定会涉及到类,抽象类和接口.那么类和抽象类以及接口到底扮演的什么角色? 本文主要是从人类社会的角度阐述类与抽象类以及接口的“社会”关系,从而让我们抛弃书上的那些死记硬背的概 ...

  6. 高性能前端 art-template 模板

    官网: https://aui.github.io/art-template/zh-cn/index.html nodejs 服务器端使用 第一步: 引入 art-template 的包 npm in ...

  7. django的小操作,查询效率up, 引用art-template模板+djangorestframework

    Part1: 提高查询效率newses = News.objects.select_related('category', 'author').get(id=1) # category和author字 ...

  8. CSS垂直翻转/水平翻转提高web页面资源重用性——张鑫旭

    一.CSS下兼容性的元素水平/垂直翻转实现 随着现代浏览器对CSS3的支持愈发完善,对于实现各个浏览器兼容的元素的水平翻转或是垂直翻转效果也就成为了可能.相关的CSS代码如下: /*水平翻转*/ .f ...

  9. thinkjs——art-template模板用法

    前言: 概述之前先附上此正式版介绍地址:https://github.com/aui/artTemplate  or http://www.jq22.com/jquery-info1097,可以再看下 ...

随机推荐

  1. Ubuntu安装CUDA9.0 + cuDNN

    本篇文章是基于安装CUDA 9.0的经验写,CUDA9.0目前支持Ubuntu16.04和Ubuntu17.04两个版本,如下图所示(最下面的安装方式我们选择第一个,即runfile方式): 下载链接 ...

  2. Codeforces Round #340 (Div. 2) D

    D. Polyline time limit per test 1 second memory limit per test 256 megabytes input standard input ou ...

  3. stout代码分析之九:c++11容器新特性

    stout大量使用了c++11的一些新特性,使用这些特性有利于简化我们的代码,增加代码可读性.以下将对一些容器的新特性做一个总结.主要两方面: 容器的初始化,c++11中再也不用手动insert或者p ...

  4. ACM1753大明A+B

    ACM1753_link 这道题利用了大数相加,但是需要将小数和整数部分分开,独立相加,然后组合成一个数: 数据的可能性: 1.两个整数相加,没有小数点 2.一个整数一个小数相加 3.两个小数相加 要 ...

  5. 【Android】完善Android学习(五:API 3.2)

    备注:之前Android入门学习的书籍使用的是杨丰盛的<Android应用开发揭秘>,这本书是基于Android 2.2API的,目前Android已经到4.4了,更新了很多的API,也增 ...

  6. Chrome浏览器启动页被360导航篡改解决方法

    右键Chrome浏览器快捷方式,选择“属性”,在“目标”的结尾处有添加的网址,删了即可. 2 如果在结尾处没有任何网址,可以添加“ -nohome”,这样下次启动时,就会打开一个空白页,也就不会打开被 ...

  7. PACM Team(牛客第三场多校赛+dp+卡内存+打印路径)

    题目链接(貌似未报名的不能进去):https://www.nowcoder.com/acm/contest/141/A 题目: 题意:背包题意,并打印路径. 思路:正常背包思路,不过五维的dp很容易爆 ...

  8. python初步学习-python控制流

    语句书写规范 缩进在python语言书写中非常重要,如果缩进不规范,执行程序将会报错 引用维基百科中的叙述: Python開發者有意讓違反了縮排規則的程序不能通過編譯,以此來強迫程序員養成良好的編程習 ...

  9. Double类型的数据四舍五入保留小数点后两位

    4种方法,都是四舍五入,例: import java.math.BigDecimal; import java.text.DecimalFormat; import java.text.NumberF ...

  10. CentOS7修改默认运行级别

    新装了一个虚拟机,图形界面启动太慢,想调整一下按照以前的经验改运行级别,输入: vi /etc/inittab 然后发现跟之前不一样了,在inittab设置不再生效: # inittab is no ...