模板引擎之-jade

##### 首先咱們安裝jade模板引擎並編譯
`npm install jade --global`
在項目文件夾下建立一個`index.jade`文件，而且寫入
```
doctype
html
head
title imooc jade study
body
h1 imooc jade study

```
而後在命令行下執行`jade -P index.jade `參數大寫P表示格式化的編譯jade文件。
##### 1、基礎篇
一、標籤
直接寫一個標籤名就能夠了，標籤裏面的內容只須要在標籤後空一個格寫文本。
二、屬性
全部的屬性均可以寫在小括號()裏面，而且類名和id名能夠用簡寫的方法.classname和#id
三、註釋
單行註釋：// ，多行註釋，非緩存註釋也就是不會編譯到html代碼中: //- ，塊註釋也是用: //-，可是須要將這個符號放在須要註釋的代碼塊上方。
四、聲明變量和數據傳遞
`-var course = 'jade'`經過`#{course}`拿到變量，而且能夠對變量進行運算`#{course.toUpperCase()}` 通常來講都是從後臺傳遞或者json文件傳遞數據。

##### 2、進階篇（流程控制）
一、for
```
- var mooc ={course:'jade',level:'high'}
- for(var k in mooc)
p=mooc[k]
```
結果是
```
<p>jade</p>
<p>high</p>
```
二、each ，能夠遍歷對象也能夠遍歷數組,也能夠嵌套循環
```
- var classes = ['jade','node','express']
each k in classes
p=k
```
結果是
```
<p>jade</p>
<p>node</p>
<p>express</p>
```
三、 while
```
- var n = 0
ul
while n <= 4
li= n++
```
結果是
```
<ul>
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
```
四、if-else

##### 3、高級
一、mixin
首先定義一個名爲study的mixin，而後再用+mixin名使用。
```
mixin study(name,course)
p #{name}
ul
each item in course
li=item
+study('luo',['jade','node'])
```
結果是
```
<p>luo</p>
<ul class="course">
<li>jade</li>
<li>node</li>
</ul>
```
二、雖然mixin可讓咱們的代碼減小重複，可是隻能在單個文件中使用，因此jade又提供了**繼承**的方法解決子文件和父文件之間的代碼複用的問題。
使用block關鍵字，表示須要複用的代碼塊
```
block des
p no no no no
block des
```
結果是
```
<p>no no no no </p>
<p>no no no no </p>
```
使用extend關鍵字能夠實現繼承，一般能夠將header和footer的部分放在一個文件中，其餘文件繼承它們。
三、模板的包含
使用的是**include**關鍵字，它能夠引入靜態html和css文件和jade文件。若是後綴名有html或者css就不會對引入的文件進行編譯，而是直接引入。