jade语法实例分析

本文小编为大家详细介绍“jade语法实例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“jade语法实例分析”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

卢龙ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为成都创新互联公司的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:028-86922220(备注:SSL证书合作)期待与您的合作!

标签

自动闭合功能 p==>

input ==>

嵌套标签的写法

p hello world  你好世界 

输入 

hello world 你好世界

标签中出现大段块内容

一:在标签后面添加 " . "

 script.

      console.log("hello world")

      console.log("hello world")

二:在每段前面加 “ | ”

    script

      | console.log("hello world")

      | console.log("hello world")  

生成:

属性用 () 分割 a(href="#")跳转 ==> 跳转

单行注释 //h2 多行注释// h2 不输出注释 //-

添加一个doctype html 就可以输出为

设置id classname

#content        如果不设置标签则默认为div

p#cont

a.btn

a#download.btn.btn-default

输出结果为:

不被缓冲的代码

-for(var i=0;i<3;i++)

   li hello world

执行结果:

  • hello world
  • hello world
  • hello world
  • 被缓冲的代码

    p=hello world   ==> 

    hello world

    p=hello world abc ==>   

    hello world <b>abc</b>

    不想被转译:

    p!=hello world abc ==> 

    hello world abc

    使用变量

    -var name = "Dream_Mz"

    p my name is #{name}  ==>

    my name is Dream_Mz

    如果要输出 #{} 需要用 "\" 转译 \#{}

    -var name = ""

    | #{name}  ==><script></script>

    不想转译:

    | !{name}  ==>

    提示: " | "是一个管道 一般可以定义一段文本

    循环

    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

    ==>

    you have an apple

    写法二:

     -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的时候输出

    you have few apple

    当apple的值不为0/1的时候 输出

    you have #{apple} apple

    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="我是按钮")

    abc

    读到这里,这篇“jade语法实例分析”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注创新互联行业资讯频道。


    标题名称:jade语法实例分析
    当前链接:http://ybzwz.com/article/jdodhh.html