这段代码的哪一部分是玉模板元素，哪一部分是 JavaScript 元素？答案

【问题标题】：Which part of this code are jade template elements and which are JavaScript elements?这段代码的哪一部分是玉模板元素，哪一部分是 JavaScript 元素？
【发布时间】：2011-11-29 15:31:52
【问题描述】：

我的理解是jade模板引擎有自己的模板元素，它也支持一些JavaScript。但是在下面的代码中我无法区分哪一个是非 JavaScript 代码（这是node.js + express.js）：

这是视图文件（index.jade）：

h1= title
#articles
    - each article in articles
      div.article
        div.created_at= article.created_at
        div.title 
            a(href="/blog/"+article._id.toHexString())!= article.title
        div.body= article.body

这是服务器文件（app.js）：

app.get('/', function(req, res){
    articleProvider.findAll( function(error,docs){
        res.render('index.jade', { locals: {
            title: 'Blog',
            articles:docs
            }
        });
    })
});

谁能帮我解决这个困惑？

【问题讨论】：

我不懂玉，但你发布的代码在我看来都不像 javascript。
第二意见：我没有看到任何 javascript。虽然，article.titlediv.title 都是有效的 javascript 调用，但我怀疑它们是否在这种情况下。

标签： javascript pug

【解决方案1】：

The Jade-Lang Readme 有一个代码部分，详细介绍了什么是客户端 JavaScript，什么不是客户端 JavaScript。

基本上，如果您在模板中使用代码，并且它不在脚本标签内，它会在将 javascript 的输出发送到浏览器之前呈现该输出。它仍然是 javascript，但它是在服务器端执行的。脚本标签中的任何 javascript 都只是普通的 javascript，并像其他所有内容一样发送到浏览器。

至于您发布的示例，该行：

- each article in articles

翻译为：

for (var article in articles) {
    /* Whatever else is going on in the template */
}

还有：

a(href="/blog/"+article._id.toHexString())!= article.title

翻译（简体）为

"<a href=\"/blog\"" + article._id.toHexString() + ">" + /* Escaped article.title */ + "</a>"

但 Jade 在将结果发送到浏览器之前会对其进行解析和渲染。

【讨论】：

感谢您的精彩解释！我以前从未听说过 Jade，但这看起来很酷。