- 用
-开始一段不直接进行输出的代码- var authenticated = true body(class=authenticated ? 'authed' : 'anon')<body class="authed"></body> - 用
=开始一段带有输出的代码，可以被求值的一个JavaScript表达式div(escaped="<code>")<div escaped="<code>"></div> - 用
!=开始一段不转义的、带有输出的代码div(escaped!="<code>")<div escaped="<code>"></div> - 用
//注释代码会转换到HTML中// 一些内容 p foo p bar<!-- 一些内容--> <p>foo</p> <p>bar</p> - 用
//-注释代码不会转换到HTML中//- 这行不会出现在结果里 p foo p bar<p>foo</p> <p>bar</p> - 用
#{}在字符串里面使用变量和函数字符串嵌入转义 - 用
!{}在字符串里面使用变量和函数字符串嵌入不转义- var friends = 10 p 您有 #{friends} 个朋友<p>您有 10 个朋友</p> - 用
#[]将 Pug 的标签语句包起来实现转换 - 条件注释是一种用于分辨 Internet Explorer 新老版本的特殊标记。
- 分支条件
case ... when ... default ...- var friends = 10 case friends when 0 p 您没有朋友 when 1 p 您有一个朋友 default p 您有 #{friends} 个朋友<p>您有 10 个朋友</p> - 条件判断
if ... else if ... else include pugFilename功能允许您把另外的文件内容插入进来block和extends关键字进行模板的继承//- layout.pug html head title 我的站点 - #{title} block scripts script(src='/jquery.js') body block content block foot #footer p 一些页脚的内容//- page-a.pug extends layout.pug block scripts script(src='/jquery.js') script(src='/pets.js') block content h1= title - var pets = ['猫', '狗'] each petName in pets include pet.pug- 块内容的添补
append / prepend//- layout.pug html head block head script(src='/vendor/jquery.js') script(src='/vendor/caustic.js') body block content-
prepend向头部添加内容一个块 -
append向尾部添加内容一个块//- page.pug extends layout.pug block append head script(src='/vendor/three.js') script(src='/game.js')
-
- 迭代方式：
each ... in ...和while - 混入
mixin是一种允许您在 Pug 中重复使用一整个代码块的方法mixin pet(name) li.pet= name ul +pet('猫') +pet('狗') +pet('猪')<ul> <li class="pet">猫</li> <li class="pet">狗</li> <li class="pet">猪</li> </ul>
扫一扫
10-04
9832
9832
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
