jade 模板引擎在node express 开发中有较多的使用,首先我们看一个简单的使用jade 生成的html 页面的标签代码:

doctype html
html(lang="en")
head
title= pageTitle
script(type='text/javascript').
if (foo) {
bar(1 + 5)
}
body
h1 Jade - node template engine
#container.col
if youAreUsingJade
p You are amazing
else
p Get on it!
p.
Jade is a terse and simple
templating language with a
strong focus on performance
and powerful features.

相应生成的html 代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
<title>Jade</title>
<script type="text/javascript">
if (foo) {
bar(1 + 5)
}
</script>
</head>
<body>
<h1>Jade - node template engine</h1>
<div id="container" class="col">
<p>You are amazing</p>
<p>Jade is a terse and simple
templating language with a
strong focus on performance
and powerful features.</p>
</div>
</body>
</html>

我们可以看到使用jade 模板可以简化我们的代码.

模板引擎之jade 学习的更多相关文章

  1. 学习篇:NodeJS中的模板引擎:jade

    NodeJS 模板引擎作用:生成页面 在node常用的模板引擎一般是 1.jade --破坏式的.侵入式.强依赖(对原有的html体系不友好,走自己的一套体系)2.ejs --温和的.非侵入式的.弱依 ...

  2. pug模板引擎(原jade)

    前面的话 为什么要引入pug,pug有什么特别之处呢?有一些嵌套层次较深的页面,可能会出现巢状嵌套,如下图所示 在后期维护和修改时,一不小心少了一个尖括号,或者某个标签的开始和闭合没有对应上,就会导致 ...

  3. [js高手之路]Node.js模板引擎教程-jade速学与实战1

    环境准备: 全局安装jade: npm install jade -g 初始化项目package.json: npm init --yes 安装完成之后,可以使用 jade --help 查看jade ...

  4. [js高手之路]Node.js模板引擎教程-jade速学与实战1-基本用法

    环境准备: 全局安装jade: npm install jade -g 初始化项目package.json: npm init --yes 安装完成之后,可以使用 jade --help 查看jade ...

  5. [js高手之路]Node.js模板引擎教程-jade速学与实战2-流程控制,转义与非转义

    一.转义与非转义 jade模板文件代码: doctype html html head meta(charset='utf-8') title jade学习-by ghostwu body h3 转义 ...

  6. 模板引擎之-jade

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

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

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

  8. Java模板引擎之Freemarker 学习笔记 一

    什么是Freemarker Freemarker是模板引擎,不是Web框架,只是视图层的组件,官网是 https://freemarker.apache.org/ Freemarker原理 数据模型+ ...

  9. 模板引擎ejs入门学习

    1:利用 NPM 安装 EJS 很简单 npm install ejs 2:安装完成肯定就是使用了 var template = ejs.compile(str, options); template ...

随机推荐

  1. 常用Java字符API

  2. word中表格占满一页,在后面出现一个空白页 删除方法

    如果空白面是最后一页,且鼠标在第一行,可选“格式”-“段落”,将这一行的行距设为固定值1磅,该空白页将自动消失.

  3. spring-mvc---Controller参数绑定的类型

    Controller参数绑定的类型 Controller的绑定参数类型6种.没有参数(系统默认类型):简单类型(Intager,Double)等:pojo类(对象):数组:集合:HashMap等. 我 ...

  4. 自定义Spark Partitioner提升es-hadoop Bulk效率

    http://www.jianshu.com/p/cccc56e39429/comments/2022782 和 https://github.com/elastic/elasticsearch-ha ...

  5. UVALive 5840 数学题

    DES:给出三种材料A,B,C每种的个数.然后组合AB,BC,AC的利润.问能获得的最大利润是多少. 开始一点思路都没有.然后发现可以枚举其中两种的个数.那么最后一种就确定了.还是感觉很机智. #in ...

  6. UVSLive 6324 求射箭覆盖的期望

    DES:给出n条线段.询问每次射中线段条数的期望. 非常简单.就是每条线段的两端与原点相连的直线之间的夹角和.如果夹角大于pi.就是2pi减去这个角.最后除以总值2pi就是所求的期望. atan2(y ...

  7. install rabbitvcs in ubuntu16.04

    reference: https://github.com/rabbitvcs/rabbitvcs how to install : sudo apt-get install rabbitvcs-cl ...

  8. javascript开发HTML5游戏--斗地主(单机模式part1)

      最近学习使用了一款HTML5游戏引擎(青瓷引擎),并用它尝试做了一个斗地主的游戏,简单实现了单机对战和网络对战,代码可已放到github上,在此谈谈自己如何通过引擎来开发这款游戏的. 客户端代码 ...

  9. java关于null的介绍及比较问题..未完待续

    非对象比较内容,用== 对象比较内容,用相应的方法比如equais. demo1

  10. WEB接口测试之Jmeter接口测试自动化 (四)

    Jmeter是压力测试.接口测试工具,Ant是基于Java的构建工具,具有跨平台的作用,jenkins是持续集成工具.将这三者结合起来可以搭建一套webservice接口测试的持续构建环境.   1. ...