zoukankan      html  css  js  c++  java
  • pug模板引擎(原jade)之 注释、条件、包含

    pug 注释

    带输出的注释
    // 一些内容
    p foo
    p bar
    
    编译:
    <!-- 一些内容-->
    <p>foo</p>
    <p>bar</p>
    
    不带输出的注释
    //- 这行不会出现在结果里
    p foo
    p bar
    
    编译:
    <p>foo</p>
    <p>bar</p>
    
    
    块注释
    body
      //-
        给模板写的注释
        随便写多少字
        都没关系。
      //
        给生成的 HTML 写的注释
        随便写多少字
        都没关系。
    
    编译:
    <body>
      <!--给生成的 HTML 写的注释
    随便写多少字
    都没关系。-->
    </body>

    pug 条件

    - var user = { description: 'foo bar baz' }
    - var authorised = false
    #user
      if user.description
        h2.green 描述
        p.description= user.description
      else if authorised
        h2.blue 描述
        p.description.
          用户没有添加描述。
          不写点什么吗……
      else
        h2.red 描述
        p.description 用户没有描述
    
    编译:
    <div id="user">
      <h2 class="green">描述</h2>
      <p class="description">foo bar baz</p>
    </div>

    注:
    unless user.isAnonymous
    等价
    if !user.isAnonymous

    pug 包含

    说明:包含(include)功能允许您把另外的文件内容插入进来。

    doctype html
    html
      include includes/head.pug
      body
        h1 我的网站
        p 欢迎来到我这简陋得不能再简陋的网站。
        include includes/foot.pug
        script
          include script.js
  • 相关阅读:
    [LeetCode] 5. 最长回文子串 ☆☆☆(最长子串、动态规划)
    代码分层思考
    bash 字符串处理
    Shell脚本调试技术
    php fsockopen
    ajax 无刷新文件上传
    jquery validator
    详解机器学习中的熵、联合熵、条件熵、相对熵和交叉熵
    互信息
    条件熵
  • 原文地址:https://www.cnblogs.com/zmztya/p/14782199.html
Copyright © 2011-2022 走看看