锚父元素错误中的锚子

Question

我找到最荒谬的 html 渲染错误了吗？如果将锚元素放入另一个锚元素中，它将在其父元素之外呈现子元素：jsfiddle

 <a id="parent" href="#"> 
     <a class="child" href="#">Child</a>
 </a>

如果将元素更改为跨度，则效果很好。 Same example with span.

<span id="parent"> 
     <span class="child" href="#">Child</span>
</span>

因为这在 chrome、firefox、IE、safari、linux、mac、windows、android 上都是相同的，所以我倾向于认为我缺少锚元素的隐藏规则。

Answer 1

由于嵌套的锚元素是 invalid HTML，大多数浏览器会尽力帮助并自动为您更正，结果是：

<a id="parent" href="#"></a><a class="child" href="#">Child</a>

span 元素不会发生同样的事情的原因是它们可以嵌套并且浏览器不会干扰。

anchor child in anchor parent element bug