本文小编为大家详细介绍“jade语法实例分析”，内容详细，步骤清晰，细节处理妥当，希望这篇“jade语法实例分析”文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。
标签
自动闭合功能 p==> <p></p>
input ==> <input/>
嵌套标签的写法
p hello world <b>你好世界</b>
输入 <p>hello world <b>你好世界</b> </p>
标签中出现大段块内容
一：在标签后面添加 " . "
script.
console.log("hello world")
console.log("hello world")
二：在每段前面加 “ | ”
script
| console.log("hello world")
| console.log("hello world")
生成：
<script>
console.log("hello world")
console.log("hello world")
</script>
属性用 () 分割 a（href="#"）跳转 ==> <a href="#">跳转</a>
单行注释 //h2 多行注释// h2 不输出注释 //-
添加一个doctype html 就可以输出为<!DOCTYPE html>
设置id classname
#content 如果不设置标签则默认为div
p#cont
a.btn
a#download.btn.btn-default
输出结果为：
<div id="content"></div>
<p id="cont"></p>
<a class="btn"></a>
<a id="downnload" class="btn btn-default"></a>
不被缓冲的代码
-for（var i=0;i<3;i++）
li hello world
执行结果：
<li>hello world</li>
<li>hello world</li>
<li>hello world</li>
被缓冲的代码
p=hello world ==> <p>hello world</p>
p=hello world <b>abc</b> ==> <p>hello world <b>abc</b></p>
不想被转译：
p!=hello world <b>abc<b> ==> <p>hello world <b>abc</b></p>
使用变量
-var name = "Dream_Mz"
p my name is #{name} ==><p>my name is Dream_Mz</p>
如果要输出 #{} 需要用 "\" 转译 \#{}
-var name = "<script></script>"
| #{name} ==><script></script>
不想转译：
| ！{name} ==> <script></script>
提示： " | "是一个管道 一般可以定义一段文本
循环
each val[,key] in OBJ val 是值 key是键（可以不写） obj是对象或者数组
#{key}：#{val}
-var name = {"key":123,"key2":456,"key3":789}
each val,key in name
h4 #{key} 的值是 #{val}
case 作用和js中的switch一样的
-var apple = 1
case apple
when 0
p you have no apple
when 1
p you have an apple
default
p you have #{apple} apple
==> <p>you have an apple</p>
写法二：
-var apple = 1
case apple
when 0: p you have no apple
when 1: p you have an apple
default : p you have #{apple} apple
合并when的值：
-var apple =1
case apple
when 0
when 1
p you have few apple
default : p you have #{apple} apple
当apple的值为0/1的时候输出<p>you have few apple</p>
当apple的值不为0/1的时候 输出<p>you have #{apple} apple</p>
mixin函数的支持
mixin setName(name,age)
ul
li 我叫 #{name}
li 我今年 #{age} 岁了
ul
+setName("张三",19)
带有块的mixin
mixin getInfo(name,age)
ul
li 我是 #{name}
li 我今年 #{age}
if block
block
ul
+getInfo("李四",18)
li 我来自China
li hello world
接受外部的类或属性
mixin link(href,name)
a(class!=attributes.class,title!=attributes.title,href=href).btn1=name
+link("#","abc")(class="btn",title="我是按钮")
<a title="我是按钮" href="#" class="btn btn1">abc</a>
读到这里，这篇“jade语法实例分析”文章已经介绍完毕，想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会，如果想了解更多相关内容的文章，欢迎关注亿速云行业资讯频道。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
