什么是<button onclick=…>之间</button>的区别

Question

我发现很多次页面都使用“a”标签，并希望将其设为按钮。 它是这样的：

<a href="#" class="button" onclick="...." />

我很困惑为什么不只是使用“按钮”标签？ 像这样：

<button onclick="....">button</button>

有什么区别？ 我真的想学习它，谢谢！

还有一个情况问题：

三个“按钮式<a>标签”如下：

暗示：

• 不同的人打电话给ajax然后得到不同的期间记录
• 需要使用onclick =“location.replace（）”因为顺利回到最后一页。

原始代码：

<a href="url" class="btn" >Today</a> 

我改为：

<a href="#" onclick="location.replace(url)" class="btn" >Today</a> 

考虑关于：

<button onclick="location.replace(url)">Today</button>

在这种情况下你会做什么？ 使用按钮标签有什么不对吗？

Answer 1

所以这里的答案是：语义。

锚点应该用于超链接。 用于从一个页面移动到另一个页面的导航项目。 它是用户可以通过单击链接获得的数据的引用。

按钮是一个按钮。 它用于功能。

在你的例子中，他们都在调用onclick事件，所以他们只会有一个区别。 对于锚点，您必须使用event.preventDefault()覆盖默认行为。

此外，谷歌的前3名成绩：

http://davidwalsh.name/html5-buttons

HTML / CSS - 按钮 - 何时使用什么

http://www.reddit.com/r/Frontend/comments/1y9zdh/anchor_vs_button_a_question_on_html_semantics/

Answer 2

这基本上是一件历史文物。

它源于将定制样式应用于锚点更容易的时间。 您可以通过在锚本身内使用更多元素轻松构建自动调整大小的“按钮外观”锚点。

今天，通过增强的CSS选项和更好的浏览器兼容性，这不是必需的。 当button是正确的语义元素，你没有理由使用a替代。

因此，使用锚点来链接到其他页面。 它应该总是有一个href ，而不是只使用#和onclick 。 现在，您仍然可以使用onclick - 只需确保href将您引导至与onclick相同的数据。 当您希望为搜索机器人导航您的站点时，这非常方便，即使实际用户将被呈现例如更具响应性的界面（例如，通过AJAX下载更新的内容）。 确保在新窗口/选项卡中打开链接的常用方法仍然有效（ctrl + click，右键单击和中键单击都不应执行onclick操作）。

按钮是与您当前所在页面交互的元素，无论是执行客户端脚本还是将表单发送到服务器。

编辑 ：

通过编辑您的问题，很明显您应该只使用具有正常href的锚点。 我们没有理由为使用onclick或button ，而你只是制作一个简单的超链接，这就是锚的。