I used handlebars as a template when I was a beginner in nodejs. Later I learned it again and used jade. It was really concise ...... Record some Study Notes for review.
Jade is based on indentation, so the tab and space cannot be mixed;
Attribute settings:Link (rel = 'stylesheet ', href ='/stylesheets/style.css ');
Variable definition:-Var users = ["Sally", "Joseph", "Sam", "Mike"] Do not use var;
Content assignment:P = user or p $ {user}. The former is often used for content as a variable, while the latter is often used for splicing 'hello' + $ {user }, P Hello world is the content of the latter directly;
Condition Statement:
// Case statement-num = 10 case num when 0 p you have no friends when 1: P you have friends default p you have # {num} friends // If statement-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 n O description.-opts = {flag: false} # sum //! Similar to unless, if! Opts. Flag H2 hello! P = options. description unless opts. Flag H2 world! P = options. Description
Loop statement:
- 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}
Multi-row output:
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‘);
Note:
// The comment block '//-' is a server-side comment
Escape and non-escape:
//-Default and! = It is not escaped, not safe (the tag is executed directly); = it will be escaped safe (the tag is converted to a string) 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 condition note:
<!--[if IE 8]> p This is IE 8<![endif]-->
Extends:
//- layout.jadedoctype htmlhtml head block title title Default title body block content//- index.jadeextends ./layout.jadeblock title title Article Titleblock content h1 My Article<!doctype html>
Filters:
Filters is run during compilation, so dynamic content cannot be used and compiled on the server. (You need to install the markdown module first)
:markdown # Markdown I often like including markdown documents.script :coffee console.log ‘This is coffee script‘
Include:
Include./Includes/foot. Jade include: markdown article. md // It Can Be a js css file or filtered text file.
Mixins:Create reusable Jade Blocks
Mixin article (title ). article. article-wrapper H1 = title if block // block keyword, that is, 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")
Directly output text:Prefix | example: | plian text can include <strong> HTML <strong> otherwise, plian is regarded as a tag <plian> </plian>
In addition to indentation, subset labels also support the expression A: Span: Em. spaces must be added after the colon.
Jade Study Notes