jade属性怎么写

关于元素和标签，可能傻傻分不清楚，什么是元素，什么是标签，举个例子

比如div是一个块状元素，那么尖括号包起来的是标签，他用来标记这个元素，尖括号里面是元素名，元素是由开始和结束标签组成，用来包含内容的整段代码，整个html文档就是由许许多多这样的元素组成

在jade里面，不管是不是自闭合标签，写法都是一样的，不用关闭，把握好嵌套结构和缩进层次就好了

 

标签知道怎么写了，那么class和id怎么写呢？这个跟css里面定义样式是一样的，分别用.和#来区分，比如为h1这个标签加一个title的calss

h1.title jade study

加一个.，紧贴h1,编译完的html就是

<h1 class='title'>jade study</h1>

id也是同理

h1#title.title jade study

加一个#，紧贴h1，编译完的html就是

<h1 id='title' class='title'>jade study</h1>

*：注意的是，在jade里面,div这个标签比较特殊

div.title#id
=>
<div id='id' class='title'></div>

这个div如果不写元素，也会自动编译成div

.title#id
=>
<div id='id' class='title'></div>

除了把classname和id直接追加到后面呢，还可以用另外一种方式做，还是以h1为例

h1.title.title2#title(class='title3') study
=>
<h1 id='title' class='title title2 title3'>study</h1>

在紧接着地方放一个括号，在扣号里面写一个title3,那id也可以拿到里面去，增加一个id等于title,在括号里面属性与属性之间需要用逗号隔开

h1.title.title2(id='title',class='title3') study
=>
<h1 id='title' class='title title2 title3'>study</h1>

其实看到这里大家就很容易理解了，所有到属性都可以拎到括号里面，只有class和id比较特殊，可以直接在标签后面追加，那么其他属性也是一样的，比如增加一个a标签

a(href='https://www.baidu.com',title='jade study',data-id='1000') link
input(value='123',name='course',type='text')

这些都跟其他标签是一种写法，但是有一种属性未必要加等号，比如默认数据

input(name='type',type='checkbox', checked)

他的默认选中独立写就可以了