有用的符号:

| 竖杠后的字符会被原样输出

· 点表示下一级的所有字符都会被原样输出,不再被识别。(就是|的升级版,实现批量)

include 表示引用外部文件

  • 短杠说明后面跟着的字符只是一段代码(与|的区别就是,|后面的内容会被显示,而短杠后面的内容直接不显示了!)

例子:

js:

const jade = require('jade');
console.log(jade.renderFile('./xxx.jade',{pretty:true,name:'singsingasong'}))

jade:

'|'的应用

'.'的应用

include的应用

调用变量做运算

div的class

'-' 的应用

变量的直接引用

span#{a}span=a效果是一样的。

jade中的for循环

jade:

-for(var i=0;i<arr.length;i++)
div=arr[i]

js文件:

console.log(jade.renderFile('./views/11.jade',{pretty:true,name:'singsingasong',
arr:['aaa','bbb','ccc','ddd']
}));

运行结果:

'!' 的应用

html
head
body
div(class='1')!=content
div(class='2')

运行结果:

jade的if...else...

html
head
body
-var a=19;
if(a%2==0)
div(style={background:'red'}) 偶数
else
div(style={background:'green'}) 奇数

case语句

html
head
body
-var a=1;
case a
when 0
div aaa
when 1
div bbb
when 2
div ccc
default
|不靠谱

综合的来一个

小提示:之前的jade文件我们都没有写DOCTYPE,这里给它加上



这个执行结果的是:如果文件读写顺利就输出‘成功’,如果出错,就返回‘错误’。

模板引擎Jade详解的更多相关文章

  1. Jade模板引擎使用详解

    在 Express 中调用 jade 模板引擎 jade 变量调用 if 判断 循环 Case 选择 在模板中调用其他语言 可重用的 jade 块 (Mixins) 模板包含 (Includes) 模 ...

  2. flask中jinjia2模板引擎使用详解1

    在之前的文章中我们介绍过flask调用jinja2模板的基本使用,这次我们来说一下jinjia2模板的使用 Jinja2 在其是一个 Python 2.4 库之前,被设计 为是灵活.快速和安全的. 模 ...

  3. flask中jinjia2模板引擎使用详解5

    接上文 宏 可以理解为函数,即把一些常用的模板片段做好封装,以便于重用,减少工作量和维护难度. 宏的定义很简单: {%macro xxx()%} ##这里写内容 {%endmacro%}   下面引用 ...

  4. 模板引擎ejs详解

    singsingasong.js: const ejs=require('ejs'); ejs.renderFile('./views/singsingasong.ejs', {'name':'sin ...

  5. maven pom文件简单模板和配置详解

    https://blog.csdn.net/earbao/article/details/49924943 maven pom文件简单模板和配置详解

  6. VC 与Matlab混合编程之引擎操作详解

    Visual C++ 是当前主流的应用程序开发环境之一,开发环境强大,开发的程序执行速度快.但在科学计算方面函数库显得不够丰富.读取.显示数据图形不方便. Matlab 是一款将数值分析.矩阵计算.信 ...

  7. tp6源码解析-第二天,ThinkPHP6编译模板流程详解,ThinkPHP6模板源码详解

    TP6源码解析,ThinkPHP6模板编译流程详解 前言:刚开始写博客.如果觉得本篇文章对您有所帮助.点个赞再走也不迟 模板编译流程,大概是: 先获取到View类实例(依赖注入也好,通过助手函数也好) ...

  8. vue-cli生成的模板各个文件详解(转)

    vue-cli脚手架中webpack配置基础文件详解 一.前言 原文:https://segmentfault.com/a/1190000014804826 vue-cli是构建vue单页应用的脚手架 ...

  9. js 模板引擎 jade使用语法

    Jade是一款高性能简洁易懂的模板引擎,Jade是Haml的Javascript实现,在服务端(NodeJS)及客户端均有支持. 功能 · 客户端支持 · 超强的可读性 · 灵活易用的缩进 · 块扩展 ...

随机推荐

  1. 解析Visual C# 7.2中的private protected访问修饰符

    去年12月份,随着Visual Studio 2017 Update 15.5的发布,Visual C#迎来了它的最新版本:7.2. 在这个版本中,有个让人难以理解的新特性,就是private pro ...

  2. 【Unity与23种设计模式】装饰模式(Decorator)

    GoF中定义: "动态地附加额外的责任给一个对象.装饰模式提供了一个灵活的选择,让子类可以用来扩展功能." 装饰模式一般用来增加新功能 它可以避免更改已经实现的程序代码 从而增加系 ...

  3. JDBC控制事务

    概念 事务(Transaction)是访问并可能更新数据库中各种数据项的一个程序执行单元(unit).事务通常由高级数据库操纵语言或编程语言(如SQL,C++或Java)书写的用户程序的执行所引起,并 ...

  4. c++ dynamic_cast 和 static_cast 的区别

    今天在看王道宝典的时候看到dynamic_cast ,一直都没用过,也不了解,今天来总结一下. dynamic_cast 和 static_cast 都可以用来强制转换指针类型,但不同的是dynami ...

  5. anaconda下安装新包一直报错(‘parse() got an unexpected keyword argument 'transport_encoding'’)

    pip没有更新 解决方案:在prompt上输入 " conda install pip "

  6. Redis单例、主从模式、sentinel以及集群的配置方式及优缺点对比

    https://my.oschina.net/zhangxufeng/blog/905611

  7. MySQL详解--锁,事务

    http://www.cnblogs.com/jukan/p/5670950.html http://blog.csdn.net/xifeijian/article/details/20313977 ...

  8. 【Linux】 用户管理

    Linux用户管理 ■ 查看用户整体情况 cat /etc/passwd可以查看用户的一些基本信息.用finger <user>似乎更加方便 查看某一个特定的用户的话就可以 grep &l ...

  9. linux --> 动态库和静态库

    库的分类 根据链接时期的不同,库分为静态库和动态库之分. 静态库:在链接阶段被链接的,生成的可执行文件就不受库的影响了,即使库被删除了,程序依然可以成功运行. 动态库:在程序执行的时候被链接的,即使程 ...

  10. 设计模式 --> (8)组合模式

    组合模式 组合模式,是为了解决整体和部分的一致对待的问题而产生的,要求这个整体与部分有一致的操作或行为.部分和整体都继承与一个公共的抽象类,这样,外部使用它们时是一致的,不用管是整体还是部分,使用一个 ...