jade模板引擎（一）

Jade 是一個高性能的模板引擎，它是用 JavaScript 實現的，並且可以供 Node 使用。

1.首先新建app.js文件

var express = require('express');
//引入express模塊
var port =process.env.PORT || 3000;
//設置端口號爲process.env.PORT或3000
var app = express();

app.set('views', './views');
app.set('view engine', 'jade');
app.listen(port);

console.log('succesful!');
app.get('/', function(req, res){
	res.render('index', {
		title: 'water 首頁'
	})
})

2.進入到命令行中，在app.js文件目錄下運行該文件

顯示運行成功

3.編寫jade文件

//1. 標籤就是簡單的單詞
html
	//2. 標籤可以有多個id和class
	#container.text.bar
		//3.1 渲染爲<p>wow!</p>
		p wow!
		//3.2 大段的文本，利用管道符號
		p
			|csdn
			|blog
			|jade
		//3.3 也可以用.來開始一段文本 
		p.
			csdn
			blog
			jade 
		//4. 標籤文本
		lable username
			input(name="user[name]")
		//5. 標籤嵌套
		ul
			li 
				a(href='#') 1
			li
				a(href='#') 2
		//6. case語句（-符號，表示不會被輸出）
		-var number = 3
		case number
			when 3
				p apple!
			when 4
				p orange!
			default
				p no fruit!
		//7. =符號表示返回值
		-var ret = 'return'
		=ret
		h1=ret
		//8. 字符串連接
		- var hi = 'hello ' + 'water!'
		p #{hi}
		//9.1 jade中的循環
		ul
			- var items = ["apple", "grape", "straberry"]
			each item in items
				li= item
			//9.2 也可以用for來實現循環
			for item in items
				li= item

在瀏覽器中顯示如下