jade复用说白了就是模板的继承。

使用 block 标识符，设置一个可修改的代码片段

layout.jade

doctype html

html

  head

    block title

      title Default title

  body

    block content

test.jade 使用extends继承layout.jade，block后对应代码片段的文字

extends ./layout.jade

block title

  title Article Title

block content

  h1 My Article

生成html

<!DOCTYPE html>

<html>

  <head>

    <title>Article Title</title>

  </head>

  <body>

  </body>

</html>

也可以通过include 引入

include ./layout.jade

如果想要追加代码片段，可以使用 append 和 prepend 指令。append 用于在原有代码片段之后追加，prepend 用于在原有代码片段之前追加。

layout.jade

doctype html

html

  head

    block title

      title Default title

  body

    block content

        p hello

test.jade

extends ./layout.jade

block title

  title Article Title

block append content

  h1 My Article

输出html

<!DOCTYPE html>

<html>

  <head>

    <title>Article Title</title>

  </head>

  <body>

    <p>hello</p>

    <h1>My Article</h1>

  </body>

</html>

jade复用的更多相关文章

  1. nodejs学习（二） ---- express中使用模板引擎jade

    系列教程,上一节教程  express+nodejs快速创建一个项目 在创建一个项目后,views目录下的文件后缀为 .jade . 打开 index.jade,具体内容如下图(忽略 header.j ...

  2. emmet,jade,haml, slim,less,sass,coffeescript等的实战优缺点

    摘要: 文章背景,来自于群内周五晚上的一次头脑风暴式的思维碰撞交流活动. 随着前端技术的蓬勃发展, 各种新技术随着生产力的需要不断的涌入我们的视野, 那今天探讨的话题是这些新时代的前端兵器谱: 一. ...

  3. jade模板引擎学习笔记（WebsStorm9.0.3+ nodejs+express+jade）

    jade环境搭建 jade标签写法 jade注释 jade添加类名.id.属性 jade添加脚本,css jade变量 jade多行文本显示 jade流程代码:for,each,while jade流 ...

  4. [js高手之路]Node.js模板引擎教程-jade速学与实战4-模板引用,继承,插件使用

    一.block 模块复用 把需要复用的模块用block定义 block后面跟上模块的名字,引用一次block 内容就会被复用一次 编译之后的结果: 二,继承模板(extends) 在实际开发中,网站的 ...

  5. 模板引擎之-jade

    ##### 首先我们安装jade模板引擎并编译`npm install jade --global`在项目文件夹下创建一个`index.jade`文件,并且写入```doctypehtml head ...

  6. Jade简单教程

    Express框架里内嵌了Jade模板引擎.正好项目里也要用到,本篇整理了下Jade的相关用法. 安装与执行 标签和属性 多行文本 变量 语句 Mixin 模板 注释 过滤器 安装与执行 安装很简单: ...

  7. Express全系列教程之(十)：jade模板引擎

    一.前言 随着前端业务的不断发展,页面交互逻辑的不断提高,让数据和界面实现分离渐渐被提了出来.JavaScript的MVC思想也流行了起来,在这种背景下,基于node.js的模板引擎也随之出现. 什么 ...

  8. jade 入门

    推荐网站: jade官网 html在线转换为jade 参考文章1 参考文章2     node的模板常用的有两个,一个是ejs,另外一个就是jade,相对来说,ejs更容易理解,像原生的html,很多 ...

  9. jade安装及基本语法使用

    一.cmd安装jade: cnpm install -g jade //cnom install jade -g与上面使用效果一致. 二.jade命令行中使用: 使用cmd: jade index.j ...

随机推荐

  1. 最短路(Bellman_Ford) POJ 3259 Wormholes

    题目传送门 /* 题意:一张有双方向连通和单方向连通的图,单方向的是负权值,问是否能回到过去(权值和为负) Bellman_Ford:循环n-1次松弛操作,再判断是否存在负权回路(因为如果有会一直减下 ...

  2. LightOJ1382 The Queue（树形DP）

    题目大概是说给一棵树的n个结点从1到n编号,要求每个结点的编号大于其父结点,问有多少种编号方式. 想了挺久的,感觉有点眉目,最后画了下样例YY出解法: 首先求出以每个结点为根的子树大小,记为size[ ...

  3. c# 纯代码方式创建快捷方式

    using System; using System.Collections.Generic; using System.Text; using Microsoft.Win32; using Syst ...

  4. 【wikioi】1250 Fibonacci数列（矩阵乘法）

    http://wikioi.com/problem/1250/ 我就不说这题有多水了. 0 1 1 1 矩阵快速幂 #include <cstdio> #include <cstri ...

  5. 利用java实现的一个发送手机短信的小例子

    今天闲来无事,在微博上看到一个关于用java实现的一个发送手机短信的程序,看了看,写的不太相信,闲的没事,把他整理下来,以后可能用得着 JAVA发送手机短信,流传有几种方法:(1)使用webservi ...

  6. 【C语言】14-返回指针的函数与指向函数的指针

    前言 前面我们花了接近3个章节学习指针,应该都感受到指针的强大了吧.指针可以根据地址直接操作内存中的数据,使用得当的话,不仅能使代码量变少,还能优化内存管理.提升程序性能.关于指针的内容还非常多,比如 ...

  7. 八、job管理

    查看用法: [root@super65 ~]# salt-run -d|grep jobs'jobs.active:' #查看当前执行的job Return a report on all activ ...

  8. windows batch语法

    windows BATCH基本知识扩展名是bat(在nt/2000/xp/2003下也可以是cmd)的文件就是批处理文件. ==== 注 =============================== ...

  9. 3. Configure the Identity Service

    Controller Node: 安装认证服务: 1. sudo apt-get install keystone   2. sudo vi /etc/keystone/keystone.conf [ ...

  10. Nginx 笔记与总结（8）Location：归纳总结

    首先对 URI 进行精准匹配,如果匹配上则退出匹配,返回精准匹配结果: 如果没有匹配上则寻找普通匹配,如果命中多个普通匹配,则记忆最长的匹配结果(不考虑 location 的顺序): 如果后面还有正则 ...