html - 我可以将按钮嵌套在另一个按钮中吗？

Question

这是试图使我的 html 语义尽可能正确导致的问题。

我有一个父按钮，它在同一页面中执行两个功能，并充当嵌套 anchor 的大容器的父标签——重定向到另一个页面——以及一个 div 标签，它也充当父标签对于另一个应该执行某些操作的按钮。

<button>
  <div id="the-most-big-container"
    <a href="http://www.RedirectMeToAnotherPage.com"></a>
   <div>
     <button> do some action </button>
   </div>
  </div>
</button>

我尝试嵌套按钮，给它一个类和 id，我应用于类和 id 的所有属性都没有在子按钮上执行，而且子按钮完全脱离大容器并放置它本身在 DOM 中就像是一个完全独立的标签，没有被任何其他标签嵌套。

[更新]

显然，将一个按钮嵌套在另一个按钮中是被禁止的，但我还想解释为什么嵌套按钮的行为对 css 样式没有响应，以及它现在如何准确地放置自己与 DOM 的关系，是吗？一个完整的独立标签本身还是什么？

此外，现在我将被迫将父按钮标签更改为任何其他标签，以便我可以在其中嵌套子按钮。我想要一个关于父按钮标签的替代标签的建议 例如:我可以将父按钮更改为 div 标签，

但我需要一个在语义上更具描述性的标签(不仅仅是一个 div)，我首先将该父按钮用作切换按钮，这样当我单击它时它会显示和隐藏最多-大容器分区。

Answer 1

放置 <button> 无效在 <button> 里面元素。
在 W3C 对按钮元素的推荐中，您可以阅读:

Content model:
Phrasing content, but there must be no interactive content descendant.

[来源:w3.org (强调我的)]

Interactive content包括:

• 一个
• 音频(如果存在控件属性)
• 按钮
• 嵌入
• 内嵌框架
• img(如果存在 usemap 属性)
• 输入(如果type属性不在隐藏状态)
• 注册机
• 标签
• 对象(如果存在 usemap 属性)
• 选择
• 文本区域
• 视频(如果存在控件属性)