首页 > 代码库 > jade模板引擎简明用法
jade模板引擎简明用法
①、特性
首个单词为标签,有一些不能识别的标签可作为code,如each for case if else if unless
zen coding风格添加标签,如
.nb#hello 生成 <div class="nb" id="hello"></div>
缩进必须统一使用tab或space,否则会报错
通过缩进来表示嵌套关系,这个很重要!如
p
a 生成 <p><a></a></p>
②、coding 与 html片段
- 后面接code
#{var} !{var} = var != var 可以在html片段中输出变量值
| 后面接文本
标签. 加了符合. 表示下一行后面嵌套的文本都为纯文本
③、嵌套
include jade路径
4、继承
extends jade路径
5、注释
// 单行注释或下一行嵌套的文本都为注释
6、mixins
减少重复工作的利器,定义一个任务块
1 mixin article(title) 2 .article 3 .article-wrapper 4 h1= title 5 if block 6 block 7 else 8 p No content provided 9 10 +article(‘Hello world‘)11 12 +article(‘Hello world‘)13 p This is my14 p Amazing article
渲染后变为
1 <div class="article"> 2 <div class="article-wrapper"> 3 <h1>Hello world</h1> 4 <p>No content provided</p> 5 </div> 6 </div> 7 <div class="article"> 8 <div class="article-wrapper"> 9 <h1>Hello world</h1>10 <p>This is my</p>11 <p>Amazing article</p>12 </div>13 </div>
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。