初学nodejs，折腾过用handlebars做模板，后来隔了一段重新学习，用了jade，真心简洁……记录一些学习笔记，以备复习。
jade是基于缩进的，所以tab与space不能混用；
属性的设置：link(rel=‘stylesheet‘, href=‘/stylesheets/style.css‘);
变量的定义：- var users = ["Sally","Joseph","Sam","Mike"] 不要var也可以；
内容赋值：p= user 或 p ${user} 前者常用于内容就是变量，后者常用于拼接‘Hello ‘ + ${user} , p Hello World 则是后者直接为内容；
条件语句：
//case语句
- num = 10
case num
when 0
p you have no friends
when 1 : p you have friends
default
p you have #{num} friends
//if语句
- options = { description : ‘reference conditionals‘ }
- flag = false
#user
if options.description
h2 Description
p.description= options.description
else if flag
h2 Description
p.description.
User has no description,
why not add one...
else
h1 Description
p.description User has no description.
- opts = { flag : false }
#sum
// ! 与 unless 同理
if !opts.flag
h2 Hello!
p= options.description
unless opts.flag
h2 World!
p= options.description
循环语句：
- for (var i=0;i<3;i++)
li shit
- var users = ["Sally","Joseph","Sam","Mike"];
- each user in users
p= user
- addrs = [‘BeiJing‘,‘GuangZhou‘,‘DongGuan‘]
- for addr in addrs
p #{addr}
- names = {xing:‘ye‘,ming:‘renming‘};
- each val,key in names
li #{key} : #{val}
多行输出：
p
| You are sleeping.
| No I just have a rest.
p.
Second function.
Just for testing.
script.
console.log(‘Hello world‘);
console.log(‘Hello life‘);
script
|console.log(‘Hello world‘);
|console.log(‘Hello life‘);
注释：
// 注释块 ‘//-‘是服务器端注释
转义 与 非转义 ：
//- 默认和!=是不转义，不安全（标签直接执行）； = 则会转义 安全（标签转字符串）
p What‘s up <escaped> 1
p= ‘What s‘ + ‘ up <escaped> 2‘
p
= ‘What s up <escaped> 3‘
p!= ‘What s‘ + ‘ up <escaped> 4‘
p
!= ‘What s up <escaped> 5‘
IE条件注释：
<!--[if IE 8]>
p This is IE 8
<![endif]-->
extends ：
//- layout.jade
doctype html
html
head
block title
title Default title
body
block content
//- index.jade
extends ./layout.jade
block title
title Article Title
block content
h1 My Article
<!doctype html>
<html>
<head>
<title>Article Title</title>
</head>
<body>
<h1>My Article</h1>
</body>
</html>
filters ：
filters是编译时候运行，所以不能使用动态内容，在服务器端编译。（需要先安装markdown模块）
:markdown
# Markdown
I often like including markdown documents.
script
:coffee
console.log ‘This is coffee script‘
<h1>Markdown</h1>
<p>I often like including markdown documents.</p>
<script>console.log(‘This is coffee script‘)</script>
include :
include ./includes/foot.jade include:markdown article.md //可以是js css等文件 也可以是Filtered Text
Mixins : 创建可重复使用的jade块
mixin article(title)
.article
.article-wrapper
h1= title
if block //block关键字，就是块
block
else
p No content provide
+article(‘Hello world‘)
+article(‘Hello DongGuang‘)
p This is my
p Hometown
mixin link(href, name)
//- attributes == {class: "btn"}
a(class!=attributes.class, href=href)= name
+link(‘/foo‘, ‘foo‘)(class="btn")
直接输出文本： 前面加 | 例如：|Plian text can include <strong>html<strong> 否则会把Plian当做标签<Plian></Plian>
子集标签除了缩进，还支持a: span: em 这种写法，冒号后面必须加空格。
时间： 2024-10-14 03:31:28