Question

根据W3C有关HTML语义编写的规则，我没有意识到是好是坏-我们应该如何用后继元素编写button元素？

在某种程度上，就像这样：

<button>
 <div>
   <span>'hi'</span>
 </div>
</button>

或仅此：

<button>'hi'</button>

Answer 1

我在W3C Validator中测试了您的代码，显示的错误为Element div not allowed as child of element button in this context. (Suppressing further errors from this subtree.)

Answer 2

基本上，规范不允许这样做。

这可能对您有用，但这不是最佳实践。

如您所见，here按钮必须不是交互式内容后代。

您还可以在here

中验证您的html

Answer 3

<button>中的嵌套标签为not valid，并返回以下when tested：

在这种情况下，元素div不能作为元素按钮的子元素。

非嵌套标签是正确的方法。

如果愿意，请自己看看。我使用了以下HTML进行测试：

<!DOCTYPE html>
<html lang="en"> 
<head> 
<title>Button test HTML</title> 
</head>
<body>
<button>
<div>
   <span>'not valid'</span>
 </div>
</button>
<button>Valid</button>
</body>
</html>

Answer 4

button element可以包含phrasing content的元素，而不是interactive content。换句话说：在段落内使用的元素（有时称为内联元素），并且不允许用户交互。

例如，这意味着它可能包含span个元素，但不包含div个元素。所以这是有效的：

<button>
  <span>'hi'</span>
</button>

<button>是否应包含嵌套的DOM元素？

4 个答案: