代码的复用是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. Scratch3架构结构说明

    Scratch3.0整体项目结构比较庞大,对于不同二次开发开始的时候会出现一头雾水,需要先了解下整体框架,可以按需要在指定的源码下进行修改,大致结构如下: 1. scratch-gui: 是基于Rea ...

  2. Flutter状态管理Provider，简单上手

    在之前的文章中介绍了 Google 官方仓库下的一个状态管理 Provide.乍一看这俩玩意可能很容易就被认为是同一个东西,仔细一看,这不就差了一个字吗,有什么区别呢. 首先,你要知道的最大的一个区别 ...

  3. 解决 Ceph v14.2.1 RGW使能压缩时遇到不生效的问

    根据常规方法部署Ceph(14.2.1 or 14.2.2)集群+rgw后,通过命令“radosgw-admin zone placement modify --rgw-zone=default -- ...

  4. 当你登录Github要求你邮箱验证身份，但是你的邮箱登录不了？

    事情发送在两天前,我如标题所示......,它给出的tyningling@163我真的不知道什么时候注册的了,尝试了N个密码登录不上,验证密保吧,看到手机号突然想起来,这是拿以前同学的手机号注册的.. ...

  5. React学习，搭建项目，入门

    react项目基于node.js.用npm包管理工具; 在cmd命令行中输入: npm install -g create-react-app 等待其安装,意思是全局安装create-react-ap ...

  6. jmeter XLSX 读取

    import org.apache.poi.xssf.usermodel.XSSFWorkbook; import org.apache.poi.xssf.usermodel.XSSFSheet; i ...

  7. mssql sqlserver时间戳与时间格式互相转换的方法分享

    转自: http://www.maomao365.com/?p=9336 摘要: 下文讲述mssql中时间戳和时间格式的转换方法,如下所示: 实验环境:sql server 2008 R2 时间戳简介 ...

  8. java输入输出 -- I/O模型简述

    一.简介 本文向大家介绍五种I/O模型.分别是阻塞I/O.非阻塞I/O.I/O复用.信号驱动式I/O.异步I/O等.内容参考<UNIX网络编程>,大家想进深入学习网络编程,建议去读读这本书 ...

  9. java日志框架系列（6）：logback框架encoder详解

    1.Encoder 1.encoder功能 Encoder 负责两件事,一是把事件转换为字节数组,二是把字节数组写入输出流. 注意:在logback 0.9.19 版之前没有 encoder. 在之前 ...

  10. （二）javaweb开发的常见概念总结（来自那些年的笔记）

    目录 WEB开发相关知识 WEB服务器 Tomcat服务器 WEB应用程序 配置WEB应用 配置缺省的WEB应用 Web设置首页 web.xml文件 配置虚拟主机 配置https连接器 为我们的网站, ...