jade支持html,Jade ！HTML框架

1.电脑要有nodejs

npm install jade -g

3.pwd

4.subl .打开编译器

格式为jade的文件

5.jade jadetut.jade 编译

安装

$ npm install jade --global

-usage

$ jade [options] [dir|file ...] Options:

-h, --help output usage information

pads pagers set-top boxes

语法

include 路径

分行用“|”

br分行

p. = p |

p(id="4th",class="xx").

sasdfdsfdsfads

注释

//can se me

定义变量

myName = "derek"

image.png

image.png

- fnI = {"type": "text", "name": "fName"}

span First Name

input(type=fnI.type, name=fnI.name)

-if语句

- date = new Date()

-hour=date.gethours()

-if((hour >=6) && (hours<= 17)) {

h3 Day Time

-}else {

h3Night time

-}

if((age>=16)&&(age<18))

h3 tough

else if age>= 18

h3 u can drive and vote

else

h3 to canw wait till your;re 16

unless age >= 16

h3 yourll drive at 16

else h3 you can drive

3.

-dayTime = (((hour >=6)&& (hour <=17)) ? 'DayTime' : 'Night Time')

h3 #{dayTime}

- name = "Sue"

case name

when "saylly"

h3 hi

when "sue"

h3 hi

default h3 hiyou

4.

script.

console.log('hello jade')

5.

-qbs = ['palmer', 'brees']

ul

-for(i=0; i

li = qbs[i]

- }

ul

each qb in qbs

li = qb

-i = 0

ul

while i<=20

li=i

- i++;

6.mixin

mixin nflPlayer(name, pos, team)

li #{name} is the #{pos}

ul#nflPlaers

+nflPlaer("Tom Brady", "Quarterback", "patriots")

+..

mixin copyr

| ©

p

+copyr

|2016

mixin makeList()

ul

-arg = Array.prototype.slice.call(arguments);

for item in args

li = item

使用带有标签的变量

image.png

javscript 代码

image.png

2nd_div.lorem_ipsum.very_import

dsfasfasf

image.png

jade --client --no

输出

image.png

`

image.png

image.png