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. Quest Central for DataBase 5.0.1，6.1 (软件+注册)

    找寻了多天,终于找到了,记录下,以后重装用.输入所有组件的licenses后,提示要注册,我选择了Canada,Google了一个地方的PostCode和phone number,填写,注册成功! 软 ...

  2. 关于Ruby的一些知识

    1 -9/2 ＝ -5 当进行一个除法运算的结果是一个负数的时候,由于Ruby采取向负无穷大圆整,所以结果是-5.而由于除数是个整数,所以结果也是一个整数.而其他语言多数是向0取整. 2 连接字符串建 ...

  3. EnableViewState=“false”不能乱用啊

    有时候页面源文件里有一段看上去像乱码的代码,这时候为了加快页面的加载速度,可以使用EnableViewState=“false”,这时候页面上的乱码就会消失了.但是,关于这个问题作者郁闷了好久,之前为 ...

  4. JavaScript事件大全

    click() 对象.click() 使对象被点击. closed 对象.closed 对象窗口是否已关闭true/false clearTimeout(对象) 清除已设置的setTimeout对象 ...

  5. 1. while循环（当循环） 2. do{}while（）循环 3. switch cose（多选一） 例子：当选循环下求百鸡百钱 用 switch cose人机剪刀石头布

    1. while循环: 当选循环下求百鸡百钱:如下: 代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN ...

  6. 配置Log4j(很详细)

    Log4J的配置文件(Configuration File)就是用来设置记录器的级别.存放器和布局的,它可接key=value格式的设置或xml格式的设置信息.通过配置,可以创建出Log4J的运行环境 ...

  7. Oracle 10g安装64位图解流程

    1. 安装准备阶段 1.1 安装Oracle环境 本例使用X-Manager来实现与Linux系统的连接,本例使用的所有命令和操作都是在X-Manager下进行.X-Manager安装完成后的配置方法 ...

  8. PAT天梯赛练习题 L3-011. 直捣黄龙（多关键字SPFA+DFS）

    L3-011. 直捣黄龙 时间限制 150 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 陈越 本题是一部战争大片 —— 你需要从己方大本营出发,一路 ...

  9. ueditor1.4.3 php版本使用修改图片上传路径

    实例化编辑器必须带上一下东西 header部分 <script type="text/javascript" charset="utf-8" src=&q ...

  10. 将request.getParameterMap()转换成可操作的普通Map

    在java web项目中虽然可以通过request.getParameterMap()很轻松的获得参数Map,但得到的Map和普通Map是不一样的,是被锁定的,不能像操作常规Map那样进行put.ge ...