1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
|
mixin list
ul
li foo
li bar
li baz
mixin pet(name)
li.pet= name
mixin article(title)
.article
.article-wrapper
h1= title
if block
block
else
p No content provided
mixin link(href, name)
//- attributes == {class: "btn"}
a(class!=attributes.class, href=href)= name
mixin list(id, ...items)
ul(id=id)
each item in items
li= item
doctype html
html
title TODO supply a title
body
- var title = "On Dogs: Man's Best Friend";
- var author = "enlore";
- var theGreat = "<span>escape!</span>";
h1= title
- var riskyBusiness = "<em>Some of the girls are wearing my mother's clothing.</em>";
.quote
p Joel: !{riskyBusiness}
p Written with love by #{author}
p This will be safe: #{theGreat}
- var msg = "not my inside voice";
p This is #{msg.toUpperCase()}
p This is #{msg.toUpperCase() == 'aa' ? 1:'not'}
p.
If you take a look at this page's source #[a(target="_blank", href="https://github.com/jadejs/jade/blob/master/docs/views/reference/interpolation.jade") on GitHub],
you'll see several places where the tag interpolation operator is
used, like so.
ul
each val in [1, 2, 3, 4, 5]
li= val
ul
each val, index in ['zero', 'one', 'two']
li= index + ': ' + val
ul
each val, index in {1:'one',2:'two',3:'three'}
li= index + ': ' + val
- var values = [];
ul
each val in values.length ? values : ['There are no values']
li= val
- var n = 0
ul
while n < 4
li= n++
//- Use
+list
+list
+article('Ahoj')
+article('Hello world')
p This is my
p Amazing article
+link('/foo', 'foo')(class="btn")
+list('my-list', 1, 2, 3, 4)
| Plain text can include <strong>html</strong>
p
| It must always be on its own line
p Plain text can include <strong>html</strong>
script.
if (usingJade)
console.log('you are awesome')
else
console.log('use jade')
a: img
img/
|
