一、结合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模板引擎高级使用的更多相关文章

  1. Django基础，Day10 - template 模板引擎与路径设置

    作为一个Web框架,Django需要一个方便的方式来生成动态的HTML.最常见的方法依赖于模板.模板包含所需的HTML输出的静态部分以及一些特殊的语法描述如何插入动态内容. Django框架后端默认支 ...

  2. art template前端模板引擎

    偶然看到后台有一段代码 采用的是art template的模板引擎 地址为 http://aui.github.io/artTemplate/ 这段代码很简洁 var html = template( ...

  3. VTemplate模板引擎的使用--高级篇

    VTemplate模板引擎的使用--高级篇 在网站中,经常会有某个栏目的数据在多个页面同时使用到.比如新闻网站或电子商务网站的栏目列表,几乎在很多页面都会显示栏目导航.对于这种多个页面同时使用到的“数 ...

  4. 如何选择Javascript模板引擎（javascript template engine)？

    译者 jjfat 日期:2012-9-17  来源: GBin1.com 随着前端开发的密集度越来越高,Ajax和JSON的使用越来越频繁,大家肯定免不了在前台开发中大量的使用标签,常见到的例子如下: ...

  5. jquery template.js前端模板引擎

    作为现代应用,ajax的大量使用,使得前端工程师们日常的开发少不了拼装模板,渲染模板 在刚有web的时候,前端与后端的交互,非常直白,浏览器端发出URL,后端返回一张拼好了的HTML串.浏览器对其进行 ...

  6. JavaScript模板引擎Template.js使用详解

    这篇文章主要为大家详细介绍了JavaScript模板引擎Template.js使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下   template.js 一款 JavaScript 模板引 ...

  7. 腾讯模板引擎template

    template.js是一款JavaScript模板引擎,用来渲染页面的. 原理:提前将Html代码放进编写模板  script id="tpl" type="text/ ...

  8. 500 Lines or Less: A Template Engine(模板引擎)

    介绍: 多数项目都是包含很多的逻辑处理,只有少部分的文字文本处理.编程语言非常擅长这类项目.但是有一些项目只包含了少量的逻辑处理,大量的文本数据处理.对于这些任务,我们期望有一个工具能够很好的处理这些 ...

  9. JavaScript学习总结(一)——延迟对象、跨域、模板引擎、弹出层、AJAX示例

    一.AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效 ...

随机推荐

  1. 安装Nexus时报Error occurred shutting down framework: java.lang.NumberFormatException: null

    Error occurred shutting down framework: java.lang.NumberFormatException: null 原因 :路径中有中文

  2. Locust性能测试-环境准备与基本使用 转自：悠悠

    前言 提到性能测试,大部分小伙伴想到的就是LR和jmeter这种工具,小编一直不太喜欢写这种工具类的东西,我的原则是能用代码解决的问题,尽量不去用工具. python里面也有一个性能测试框架Locus ...

  3. Unity - 绘制正五边形网格

    本文简述了Unity中绘制正五边形网格的基本方法:计算顶点信息.设置三角形覆盖信息.创建配置mesh 绘制方法 基本思路:计算出五边形顶点坐标信息作为数组,设置三角形包围方式,再创建新的mesh配置v ...

  4. Grafana+prometheus+AlertManager+钉钉机器人

    一.Grafana (1)安装Grafana的Linux环境 在官网下载windows的Grafana的压缩包到指定目录,解压缩Grafana压缩文件到包含当前Grafana版本的文件夹.将该文件夹解 ...

  5. JavaScript 的内置对象和浏览器对象

    JavaScript 中对象通常包括两种类型:内置对象和浏览器对象,此外用户还可以自定义对象. 在 ECMAScript 中,更精确的定义应该分为:本地对象.内置对象和宿主对象. 对象包含两个要素: ...

  6. 一道经典面试题，atoi函数的实现

    参考资料 (1)atoi函数的实现 (2)<剑指offer> 题目分析 本题需要注意的有几个方面: (1)检查输入参数,指针是否为NULL: (2)去除字符串前面的空格 (3)处理正负符号 ...

  7. CNN原理

    卷积神经网络(Convolutional Neural Network)的结构类似于神经网络,可以看做是对其的改进.它利用局部连接.权值共享.多核卷积.池化四个手段大大降低了参数的数目,使得网络的层数 ...

  8. 初次尝试vue脚手架

    1.第一步首先安装NodeJs ,从nodejs 官网去down,然后安装  安装完成后,我安装了GIT 自己从官网去下载进行安装 2.检查安装是否成功,windows+r  -> cmd,输入 ...

  9. Mysql 整数类型的字段的属性设置及常用的函数

    数据类型 二.MySQL支持的数据类型 数值类型.日期类型.字符串类型 1.数值类型 1)整数类型 tinyint.smallint.mediumint.int和bigint 2)zerofill属性 ...

  10. PHP实现微信对账单处理

    最近要做支付对账,即检查第三方支付与数据库中账单是否一一对应,涉及到微信对账单的处理,成功时,微信账单接口返回数据以文本表格的方式返回,第一行为表头,后面各行为对应的字段内容,字段内容跟查询订单或退款 ...