我认为这是一个很难回答的问题。或许获得某种合理答案的最佳方法是关注为什么它应该不如所描述的那样可能,而不是为什么可能。
首先,我们谈论的是超文本标记语言 HTML。让我们将其视为资源的描述语言。考虑到它的历史,我们还假设,就资源而言,我们谈论的是简单的文本文档。
所以现在有一些非常基本的概念可以从语义上描述这样的文档,比如“这是一个标题”(h1)、“这是一个段落”(p)、“这是一个列表”(li)等等.
其中一个概念是用于引用另一个资源的链接。有几种类型的链接,例如。 G。用于引用样式表(链接)、图像(img)或其他文档(表单)。
a 元素在语义上 (!) 绑定到此概念并表示/描述两个资源之间的关系。因此,您将锚点从源头扔到目的地,并可能描述这种关系。这就像在 UML 图中的 2 个实体之间画一条线并描述它们之间的关系。
因此,<p> 和 <a> 元素描述了完全不同的概念。一个在文本中声明一个段落,另一个描述资源之间的关系。
那么,从语义的角度来看,<p href="other-page.html">Some Text</p> 是什么意思?文本中的段落链接到另一个资源...?那段描述资源之间的关系?这甚至有意义吗?在一本真正的书中,这就像第 1 页上的一段说“嘿,我与第 123 页有关”。但它不再是一个段落,而是一个关系的描述——我们已经通过<a>标签实现了这个概念。
基本上就像在说
<p>
<a href="other-page.html">
I'll just put the whole relationship description in a paragraph.
</a>
</p>
有什么意义?段落是段落,链接描述是链接描述。一个段落可能包含一个链接,但不仅仅包含一个链接,因为从语义的角度来看这没有多大意义。
但是现在让我们回到未来。如今,我们正在处理更复杂的文档,并且更多地关注 UI 以及如何使它看起来更漂亮而不是语义。只要它看起来不错,我们(大多数情况下)并不关心文本是否包含在 p、div、article 或 span 元素中 - 毕竟,它只是一个描述和在大多数情况下,我们只需要从 CSS 或 JS 中引用一些东西。
所以人类并不关心标记,但计算机会。相同的语义仍然适用,并且它们是像 Google bot 这样的计算机确定他们正在处理的文档的哪一部分以及如何处理它的唯一方法(例如:“嘿,这是一篇文章,这可能是最重要的部分”或“这只是页脚,不要介意重复的内容”)。
在早期,没有办法给元素“样式化”,所以它在不同的用户代理中可能看起来有点不同。用户代理只知道:“好的,这是一个标题,让我们把它加粗并增加一点字体大小”。
所以每个元素都有自己的用途和不同的关注点。当您尝试合并它们时,您不仅必须结合两者的属性(重复属性、浏览器中的不同处理......),而且您还必须描述它的含义。你可能会发现它没有任何意义。
我希望至少这个答案确实有意义,并且它以某种方式回答了您的问题。