Html 元素 a 不得作为按钮元素的后代出现
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/24837102/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
The element a must not appear as a descendant of the button element
提问by user44690
Please help, I am getting error via http://validator.w3.org/while validating my html5 template. I get the message " The element a must not appear as a descendant of the button element". I can't understand this. Could anyone help me to solve this?
请帮忙,我在验证我的 html5 模板时通过http://validator.w3.org/收到错误消息。我收到消息“元素 a 不得作为按钮元素的后代出现”。我无法理解这一点。谁能帮我解决这个问题?
Here is my code---
这是我的代码---
<div class="post-response btn-group btn-group-lg">
<a href="#"><button type="button" class="btn btn-default"><i class="fa fa-comment"> 5 Comments</i></button></a>
<a href="#"><button type="button" class="btn btn-default"><i class="fa fa-heart"> 5 Likes</i></button></a>
</div>
回答by Shekhar Pankaj
The Error Message have Answered Your doubt Already According to HTML5 Spec Documentation
根据 HTML5 规范文档,错误消息已经回答了您的疑问
you can nest any elements inside an <a>
except the following:
您可以在 a 中嵌套任何元素,<a>
但以下内容除外:
<a>
<a>
audio>
(if the controls attribute is present)
audio>
(如果存在控件属性)
<button>
<button>
<details>
<details>
<embed>
<embed>
<iframe>
<iframe>
<img>
(if the usemap attribute is present)
<img>
(如果存在 usemap 属性)
<input>
(if the type attribute is not in the hidden state)
<input>
(如果type属性不处于隐藏状态)
<keygen>
<keygen>
<label>
<label>
<menu>
(if the type attribute is in the toolbar state)
<menu>
(如果type属性处于toolbar状态)
<object>
(if the usemap attribute is present)
<object>
(如果存在 usemap 属性)
<select>
<select>
<textarea>
<textarea>
<video>
(if the controls attribute is present)
<video>
(如果存在控件属性)
So you need to use some css to design an Button (or there is many Methods) instead of adding Button
inside a
element.
所以你需要使用一些css来设计一个按钮(或者有很多方法)而不是添加Button
内部a
元素。
回答by Fenton
The usual error from the W3C validator is:
W3C 验证器的常见错误是:
The element button must not appear as a descendant of the a element
元素按钮不得作为 a 元素的后代出现
This makes more sense for your question, as you have a button that is a descendant of an anchor.
这对您的问题更有意义,因为您有一个按钮是锚的后代。
Normally, you could solve the issue by simply styling your anchor tag, or by placing the button within a form element:
通常,您可以通过简单地设置锚标记样式或将按钮放置在表单元素中来解决问题:
<form style="display: inline" action="http://www.example.com/" method="get">
<button>Some Call to Action</button>
</form>
But in your case, I don't think you even need the anchors as you aren't linking anywhere using HTML (and if you are attaching events using JavaScript, you could simply attach those events to the button rather than the anchor.
但在您的情况下,我认为您甚至不需要锚点,因为您没有使用 HTML 链接任何地方(如果您使用 JavaScript 附加事件,您可以简单地将这些事件附加到按钮而不是锚点。