如何在Jade中将元素呈现在一行上？

Question

我还在学习Jade。以下标记可以工作，但它会导致元素呈现为两行。我希望链接和p.some_classname文本在同一行呈现，但不要将p.some_classname转换为超链接。

for elem in elems
  a(href="/foo/#{var1}/bar/#{var2}").baz.i.icon-cog
  p.some_classname= elem.id_1 + ' ' + elem.id_2

这可能吗？

- Evan Emolo

---

“在同一行”是什么意思？是指你的HTML代码中同一行还是浏览器中可见输出分别显示在不同行？ - Noah

浏览器中可见的输出。 - Evan Emolo

Answer 1

如果我正确理解了您的请求，您希望链接和文本在同一行上，每个元素一行。如果是这样，您只需要将段落包裹文本并使用span标签：

for elem in elems
   p.some_classname 
       a(href="/foo/#{var1}/bar/#{var2}").baz.i.icon-cog
       span= elem.id_1 + ' ' + elem.id_2

这将为每个元素生成以下内容：

<p class="some_classname"><a href="/foo..." class="baz i icon-cog"><span>{val for id_1} {val for id_2}</span></p>

或者，您可以进一步简化并跳过 span 标签：

for elem in elems
   p.some_classname 
       a(href="/foo/#{var1}/bar/#{var2}").baz.i.icon-cog
       | #{elem.id_1} #{elem.id_2}

我刚刚使用node测试了两种方法，根据你期望的最终标记，两种方法都能起到作用。希望这对你有所帮助。

- Matt Hagopian

Answer 2

除了Matt的回答之外，您还可以像这样分别使用ID和CSS类：

p 
     | #[ObjectId1.class1 SomeText ]
     | #[ObjectId2.class2 #{jsonObject.attribute}]

- Matheus Santz

Answer 3

据我所知，没有一种方法可以有选择地删除任意两行之间的换行符。但是，如果在不使用--pretty或-P选项的情况下运行jade，则整个输出将被折叠成单行。

- David Weldon