【问题标题】:Rendering Jade template via AJAX and trying to pass/access data separate from the HTML通过 AJAX 渲染 Jade 模板并尝试与 HTML 分开传递/访问数据
【发布时间】:2026-02-04 18:55:02
【问题描述】:

我正在使用 Express 通过 res.render 在 ajax 调用上渲染 Jade 模板。问题是我想将一些 JSON 变量或 Javascript 对象与 HTML 一起传回。

这是否可能以一种优雅的方式或根本没有?我知道我可以将脚本标记与 HTML 一起传递,但我不确定如何直接在“数据”响应中访问这些值。

这里的例子:

- var someNumber = 89
h1 Hello World
li #{someNumber}

通常在 ajax 调用中此模板的 res.render() 中,您会返回

<h1> Hello Wolrd </h1>
<li> 89 </li>

全部为 HTML 格式。

如何访问回调中的 HTML 节点之一?理想情况下使用 jQuery 选择器,例如 $('h1 li')。我需要访问回叫中的号码,但它似乎没有抓住它。我正在考虑监听器或添加延迟,或者我需要将它分配给一个字符串并解析出来。

【问题讨论】:

  • 我不明白。能否请您发布您正在使用的代码?
  • @MarkLinus 更新更清晰。

标签: javascript html node.js express pug


【解决方案1】:

不完全确定我理解这个问题。但是,通过 Jade 将 JSON 直接传递给浏览器。在您的路线逻辑中,您需要以下内容:

    res.render "test",
    title: "Test"
    debugJson: {
      'Read Folder Result' : result, 
      'HTTP' : {
        'Req URL' : req.url,
        'Req Query' : req.query,
        'Req User' : req.user,
        'Req Headers' : req.headers,
        'Req' : req,
        'Res' : res
      }
    }

(对不起,那是在 CoffeeScript 而不是 JS 中)

在你的 Jade 模板中,你需要有类似的东西(在脚本中):

var myJson = !{JSON.stringify(debugJson)};

这会将 JSON 直接传递到脚本中。如果您希望它直接进入 DOM,例如:

#debug !{JSON.stringify(debugJson)}

这会将其转储到 div 中。

如果您只想在 Jade 模板中处理它,您可以简单地在 Jade 中使用循环。请参阅此previous * question 了解如何执行此操作。

【讨论】:

  • 好吧,所以无论哪种方式,我都必须将它作为脚本变量传递。这就是我试图避免做的事情。也许多个请求会是一个更好的解决方案,但恐怕不是。
  • 老实说,将 JSON 传递到浏览器的最佳方式根本不是这种方式。如果你只需要那块,只需使用 res.json()。