Jade - 如何在 href 标签内添加额外的 href 标签答案

【问题标题】：Jade - how to have extra href tag inside href tagJade - 如何在 href 标签内添加额外的 href 标签
【发布时间】：2015-01-14 15:50:27
【问题描述】：

a.item(href="/more/" + article.id)
  div 
    p brief summary
    a(href="/more/" + article.id)

如果我尝试在 href 标记中插入额外的 href 标记，它会给我带来奇怪的破坏布局。检查查看源代码，它显示最后一个 href 标记在 div 之外。不知道如何在 Jade 模板的 href 标记中添加 href 标记。

帮助表示赞赏。

【问题讨论】：

标签： pug

【解决方案1】：

这段代码对我有用。我建议检查你的缩进，确保你总是使用空格，而不是使用制表符。（也许嵌套的 Anchor 标记使用的是制表符而不是四个空格。）但是，请注意，无论输出如何，嵌套的 Anchor 标记都是无效的 HTML，并且不符合 HTML。

此代码使用在线 Jade 处理器进行测试：http://jade-lang.com/demo/

使用翡翠码：

a.item(href="/more/" + article.id)
  div 
    p brief summary
    a(href="/more/" + article.id)

使用 JSON 对象：

{
  article: {
    id: 'foo'
  }
}

翡翠输出是：

<a href="/more/foo" class="item">
  <div> 
    <p>brief summary</p><a href="/more/foo"></a>
  </div></a>

关于无效的 HTML：

如 HTML4 规范中所述，一个 Anchor 标签不能嵌套在另一个 Anchor 标签内：http://www.w3.org/TR/html4/struct/links.html#h-12.2

<!ELEMENT A - - (%inline;)* -(A) -- anchor -->

The interactive element a must not appear as a descendant of the a element.

【讨论】：