特別注意:
縮排要麼用空格,要麼用tab,不能同時用兩種
子元素和父元素要有縮排
標籤和文字之間要有空格
doctype html
html
head
title this is title
body
section
divp
ulstrong
hr
加class
p. 後跟**塊
| 表示換行
jade 也可以巢狀html標籤
style.
body
script.
//單行注釋
//- 非緩衝注釋 不會編譯到html中
//-
p 塊注釋
//條件注釋
變數申明 和 資料傳遞
安全轉義 和 非安全轉義
doctype html
html
head
title
body
-var data = 『
text
』 p #//&*** ….
p= data
p !//不轉義
p!= data
輸出 # ! {}
p # ! ,]
dl -var n = 0
ul while n < 4
li= n++
if lessons
if lessons.length > 1
p #
else if lessons.length > 2
p= lesson.join(『, 『)
else
p no lesson
//反向判斷 unless
mixins jade **塊重用 是乙個函式
mixin lesson
p hello mixin
+lesson //呼叫lesson
mixin study(arg1,arg2)
p #
ul.courses
each c in arg2
li= c
+sdudy(『***』,[a,b,c])
//巢狀呼叫
mixin group(student)
+study(student.name,student.courses)
+group()
//mixin就相當於函式 接下來不同說,當**太多的時候
//難免會出現多個文件的維護 感覺這些個概念完全是用來組織**的
//模版繼承
block desc
p hello world
block desc
extends layout
//模版包含
include head
include title.html
jade.js 裡面的complie render readfile
filters 與其它外掛程式共同使用
//不能傳動態資料
:markdown
hi,this is a markdown [link]
(:less
body
}script
:coffee
console.log 『hello,coffee』
******************************==
jade -p index.jade// 編譯成index.html
jade學習筆記
1 編譯檔案 jade 檔名 p w 2 大段文字的寫法 內容前加 或者採用.元素名.內容 例 3 注釋 單行注釋 jade注釋 僅在jade中注釋,不會顯示在html檔案裡 塊注釋 下面一行並縮排的 都會被解釋成塊注釋 僅在jade中注釋,html中不顯示 例 4 宣告變數和替換資料 1.直接在j...
學習前端模板引擎 jade 一
通常大部分前端開發工作者一開始步入前端開發的時候,都是直接簡單的寫html頁面然後丟給後台開發,後台開發在來嵌入模版。對於日益龐大的前端頁面來說,還是用老的字串拼接的方法來嵌入html內容已經不適應當下的開發趨勢了。廢話不多說,直接切入正題。第二步我要安裝npm包管理工具,在node環境下,不裝gr...
Jade高階使用
要使用jade,其實不是那麼容易接受的,幾個優點我列出來。1.熟悉的話,開發確實比較快,適合全棧開發。2.強制使用縮排,但比較簡潔,也不像html又要寫開頭又要寫結尾。3.模板繼承方便 pages 放置頁面 layout.jade var express require express var po...