代码的复用是jade非常突出的一个设计目标,jade不仅仅通过mixin来复用代码,他在文件的组织能力上也非常突出,说白了,就是继承和包涵
 
block定义的方式和调用的方式
block desc
  p jade study
block desc
block desc
=>
<p>jade study</p>
<p>jade study</p>
<p>jade study</p>
继承
layout.jade
html
  head
    meta(charset='utf-8')
    title layout
  body
    block descript
      p from layout
    block content

index.jade

extends layout.jade
block content
  block descript
    p desc from index
  h1 mixin
  mixin lession
    p jade study
  +lession
=>
index.html
<html>
  <head>
    <meta charset="utf-8"/>
    <title>layout</title>
  </head>
  <body>
    <p>desc from index</p>
    <p>desc from index</p>
    <h1>mixin</h1>
    <p>jade study</p>
  </body>
</html>
这里extends,多个文件可以复用,最大的减少代码的重复,block也是就近原则

jade继承的更多相关文章

  1. jade模板引擎

    最近用jade写了点东西,觉得挺有趣的,是一个有意思的模板引擎. 比如说,像这样的结构的html <span> <i class="icon-edit">& ...

  2. jade 入门

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

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

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

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

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

  5. jade学习02

    模版继承 ; block,extends ;如果是原生html文件的话,后缀html //layout.jade doctype html html head meat(charset='utf-8' ...

  6. Jade之Template Inheritance

    Template inheritance jade支持通过关键字block和extends来实现模板继承. 比如,在layout.jade写上如下代码 html head title My Site ...

  7. Jade之Extends

    Extends jade允许多个jade文件继承一个jade文件. jade: //- layout.jade doctype html html head block title title Def ...

  8. jade模板引擎学习笔记(WebsStorm9.0.3+ nodejs+express+jade)

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

  9. jade复用

    jade复用说白了就是模板的继承. 使用 block 标识符,设置一个可修改的代码片段 layout.jade doctype html html head block title title Def ...

随机推荐

  1. sonar:soanrqube接口api

    背景: jenkins+sonar集成了代码扫描,但是发出的邮件不管项目质量是通过还是失败,每次邮件的标题都是jenkins的构建状态,所以需要获取sonar中该项目的扫描结果. 解决: 在sonar ...

  2. 【计算机视觉】Selective Search for Object Recognition论文阅读2

    Selective Search for Object Recognition 是J.R.R. Uijlings发表在2012 IJCV上的一篇文章.主要介绍了选择性搜索(Selective Sear ...

  3. Vue3 相比 vue2

    Vue3 使用Proxy替代了defineProperty. Proxy 相比于 defineProperty 的优势 Object.defineProperty() 的问题主要有三个: 不能监听数组 ...

  4. oracle数据库数据转储最好方式(数据库表、数据结构和数据一并导出)

    导入:使用plsql:Tools --> Import Tables --> SQL Inserts  得到的为sql文件,在转储的过程中当导入另一个库的时候老是报  “表或视图不存在” ...

  5. eNSP——静态路由的基本配置

    原理: 静态路由是指用户或网络管理员手工配置的路由信息.当网络的拓扑结构或链路状态发生改变时,需要网络管理人员手工修改静态路由信息. 相比于动态路由协议,静态路由无需频繁地交换各自的路由表,配置简单, ...

  6. 第一个web 程序(servlet 和 jsp )&

    开发工具是便于程序员的编写,真正运行的代码不是编写的代码,而是tomcat服务器中部署好的代码.tomcat 会根据请求自动调用对应的代码进行请求处理. 可能遇到的问题: 1. 没有classes文件 ...

  7. C语言--函数嵌套调用

    一.实验作业(6分) 本周作业要求: 选一题PTA题目介绍. 学习工程文件应用,设计实现学生成绩管理系统. 学生成绩管理系统要求 设计一个菜单驱动的学生成绩管理程序,管理n个学生m门考试科目成绩,实现 ...

  8. WUSTOJ 1235: 计算矩阵的鞍点(Java)

    1235: 计算矩阵的鞍点 题目   输出二维数组中行上为最大,列上为最小的元素(称为鞍点)及其位置(行列下标).如果不存在任何鞍点,请输出"404 not found"(不带引号 ...

  9. spark集群安装并集成到hadoop集群

    前言 最近在搞hadoop+spark+python,所以就搭建了一个本地的hadoop环境,基础环境搭建地址hadoop2.7.7 分布式集群安装与配置 本篇博客主要说明,如果搭建spark集群并集 ...

  10. awr报告没有数据11.2.0.3

    有个朋友,反馈AWR没有数据: 咨询版本:oracle企业版本11.2.0.3 SQL> select * from v$version; BANNER -------------------- ...