art-template模板引擎高级使用
一、结合express的基本使用
// npm下载express/art-template/express-art-tempalte,并且加载
var express=require('express');
var path=require('path');
var app=express();
// 配置(express-art-template是express来整合art-templatedao的,虽然不用加载art-template,但是也必须安装)
app.engine('html',require('express-art-template'));
//这是默认设置,需要设置其他的路径可以在这设置
app.set('views',path.join(__dirname,'./views/'));
// 请求和响应
app.get('/',function(req,res){
//express为response相应对象提供了一个方法render('html模板名',{模板数据}),默认是不可以使用的,配置模板引擎以后就可以使用
//第一个参数不能写路径,express默认会去项目中的views目录找index.html(约定视图文件放在views目录)
res.render('index.html',{
name:'张三'
})
});
// 绑定端口
app.listen(3000,function(){
console.log('server is running...')
});

二、include的使用

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
{{include './header.html'}}
{{name}}
{{include './footer.html'}}
</body>
</html>

三、extend的使用
①添加新文件layout.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<!-- 引入公共头部 -->
{{include './header.html'}}
<!-- 使用模板继承 -->
{{block 'content'}}
<h1>默认内容</h1>
{{/block}}
<!-- 引入公共尾部 -->
{{include './footer.html'}}
</body>
</html>
②同时修改index.html,在index.html继承

③在index.html里可以修改默认内容(填坑)
{{extend './layout.html'}}
{{block 'content'}}
<div>
<h3>可以在这里修改默认的内容</h3>
</div>
{{/block}}

art-template模板引擎高级使用的更多相关文章
- Django基础,Day10 - template 模板引擎与路径设置
作为一个Web框架,Django需要一个方便的方式来生成动态的HTML.最常见的方法依赖于模板.模板包含所需的HTML输出的静态部分以及一些特殊的语法描述如何插入动态内容. Django框架后端默认支 ...
- art template前端模板引擎
偶然看到后台有一段代码 采用的是art template的模板引擎 地址为 http://aui.github.io/artTemplate/ 这段代码很简洁 var html = template( ...
- VTemplate模板引擎的使用--高级篇
VTemplate模板引擎的使用--高级篇 在网站中,经常会有某个栏目的数据在多个页面同时使用到.比如新闻网站或电子商务网站的栏目列表,几乎在很多页面都会显示栏目导航.对于这种多个页面同时使用到的“数 ...
- 如何选择Javascript模板引擎(javascript template engine)?
译者 jjfat 日期:2012-9-17 来源: GBin1.com 随着前端开发的密集度越来越高,Ajax和JSON的使用越来越频繁,大家肯定免不了在前台开发中大量的使用标签,常见到的例子如下: ...
- jquery template.js前端模板引擎
作为现代应用,ajax的大量使用,使得前端工程师们日常的开发少不了拼装模板,渲染模板 在刚有web的时候,前端与后端的交互,非常直白,浏览器端发出URL,后端返回一张拼好了的HTML串.浏览器对其进行 ...
- JavaScript模板引擎Template.js使用详解
这篇文章主要为大家详细介绍了JavaScript模板引擎Template.js使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 template.js 一款 JavaScript 模板引 ...
- 腾讯模板引擎template
template.js是一款JavaScript模板引擎,用来渲染页面的. 原理:提前将Html代码放进编写模板 script id="tpl" type="text/ ...
- 500 Lines or Less: A Template Engine(模板引擎)
介绍: 多数项目都是包含很多的逻辑处理,只有少部分的文字文本处理.编程语言非常擅长这类项目.但是有一些项目只包含了少量的逻辑处理,大量的文本数据处理.对于这些任务,我们期望有一个工具能够很好的处理这些 ...
- JavaScript学习总结(一)——延迟对象、跨域、模板引擎、弹出层、AJAX示例
一.AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效 ...
随机推荐
- CLRS最大子数组问题
今天我们一起来看一下关于最大子数组的一些问题.最大子数组的应用场景可以是这样的:有一天,你搞了一场投资开始炒股,这时你就会想,我怎样才能获得最大的利润呢,最简单的想法就是我在股票的最低价时买入,然后在 ...
- pytest_05_fixture之conftest.py
前面一篇讲到用例加setup和teardown可以实现在测试用例之前或之后加入一些操作,但这种是整个脚本全局生效的,如果我想实现以下场景: 用例1需要先登录,用例2不需要登录,用例3需要先登录.很显然 ...
- 打家劫舍I
题目描述(LeetCode) 你是一个专业的小偷,计划偷窃沿街的房屋.每间房内都藏有一定的现金,影响你偷窃的唯一制约因素就是相邻的房屋装有相互连通的防盗系统,如果两间相邻的房屋在同一晚上被小偷闯入,系 ...
- 全栈项目|小书架|服务器端-NodeJS+Koa2 实现点赞功能
效果图 接口分析 通过上面的效果图可以看出,点赞入口主要是在书籍的详情页面. 而书籍详情页面,有以下几个功能是和点赞有关的: 获取点赞状态 点赞 取消点赞 所以项目中理论上与点赞相关的接口就以上三个. ...
- nginx+lua+storm的热点缓存的流量分发策略自动降级
1.在storm中,实时的计算出瞬间出现的热点. 某个storm task,上面算出了1万个商品的访问次数,LRUMap 频率高一些,每隔5秒,去遍历一次LRUMap,将其中的访问次数进行排序,统计出 ...
- HTML页面导出PDF——高清版
需要做一个导出PDF的功能,网上找有很多,但是一般导出来的都是比较模糊的那种,下面这个是高清版的,导出的PDF都是几M,跟正常手动导出的差不多,很清晰. 首先用到的JS有: <script ty ...
- mybatis使用foreach处理List中的Map mybatis-----传入传出多个参数,都是map或list,批量更新
https://nannan408.iteye.com/blog/2170470 https://blog.csdn.net/xingzhishen/article/details/86424395 ...
- 如何删除mysql注释
Linux命令删除注释 先把库表导出成一个.sql文件,然后使用sed命令删除注释.此种适用于mysql端口不开外网的情况. $ cat create_table.sql create table t ...
- 在Spring中使用AspectJ实现AOP
在Spring中,最常用的AOP框架是AspectJ,使用AspectJ实现AOP有2种方式: 基于XML的声明式AspectJ 基于注解的声明式AspectJ 基于XML的声明式AspectJ 1. ...
- Java 相等判断
==的判断机制是:根据两边的内存地址是否相同来判断. equals()是Object类的一个实例方法,判断机制和 == 完全一样. String类重写了equals()方法,是根据数据值来判断的. 总 ...