doctype html html head meta(charset='utf8') - var title = 'jade模板引擎学习-by ghostwu'; title #{title.toUpperCase()} style. * { margin : 0; padding: 0; } li { list-style-type: none; } a { text-decoration: none; color: white; } #nav { width:980px; height: 34px; margin:20px auto; line-height:34px; background:#800;} #nav li { float:left; } #nav li.active { background:red; } #nav li:hover { background:#09f; } #nav li a{ padding: 5px 10px; } body div#nav ul li.active a(href='javascript:;') 首页 li a(href='javascript:;') 玄幻小说 li a(href='javascript:;') 修真小说 li a(href='javascript:;') 都世小说 li a(href='javascript:;') 科幻小说 li a(href='javascript:;') 网游小说
#{}： 可以解释变量, toUpperCase():变量转大写
把json文件的数据在编译的时候传递到模板,
新建data.json文件数据
{ "content" : "跟着ghostwu学习jade" } index2.jade文件模板:
doctype html html head meta(charset='utf8') - var title = 'jade模板引擎学习-by ghostwu'; title #{title.toUpperCase()} body h3 #{content}
编译命令：jade index2.jade -P -O data.json -O 指定一个json文件，把json文件的数据传递到模板
编译后的结果：
<!DOCTYPE html> <html> <head> <meta charset="utf8"> <title>JADE模板引擎学习-BY GHOSTWU</title> </head> <body> <h3>跟着ghostwu学习jade</h3> </body> </html>
以上这篇基于Node.js模板引擎教程-jade速学与实战1就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
您可能感兴趣的文章: