强调：所有javascript表达式都能用
属性 Attribute
多行属性（可以换行写）： 可以搭配模板字符串
input(type='checkbox' name='agreement' checked)
用引号括起来的属性
div(class='div-class' (click)='play()')
属性嵌入
var btnType = 'info' var btnSize = 'lg' button(type='button' class='btn btn-'+btnType+' btn-'+btnSize)
不转义的属性
div(escaped!="<code>") 注：使用'!=' 表示不转义，即 '<' 不用转义为 '<'
布尔值属性
input(type='checkbox' checked=false) 注：checkd 不给值，默认是true,pug是经过映射的
样式属性：样式属性可以写成对象形式
a(style={color:'red',background:'green'})
类属性： 可以赋值为数组，可以写成数组，可以写成对象（一般用于判断）
var classes=['foo','bar','baz'] a(class=classes) 还可以通过判断映射 var currentUrl ='/about' a(class={active:currentUrl==='/'} href='/') Home a(class={active: currentUrl === '/about'} href='/about') About 转义内容为： <a href="/">Home</a> <a class="active" href="/about">About</a>
类的字面量
a.button 编译为：<a class="button"></a>
类属性+类的字面量
a.bang(class=classes class=['bing']) 编译为：<a class="bang foo bar baz bing"></a>
ID的字面量
a#main-link 编译为：<a id="main-link"></a>
$attributes
div#foo(data-bar="foo")&attributes({'data-foo': 'bar'})
或者
- var attributes = {};
- attributes.class = 'baz';
div#foo(data-bar="foo")&attributes(attributes)
编译为：<div class="baz" id="foo" data-bar="foo"></div>
特别说明：
doctype html
注：pug是没有进行映射属性的，而是使用缩写样式（terse style）
编译后为： <!DOCTYPE html>