<button onclick =“...”>和<a href="#" onclick=".../"></a> </button>之间有什么区别

Question

我发现页面多次使用＆＃34; a＆＃34;标记，并希望使它像一个按钮。它是这样的：

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

我很困惑为什么不使用＆＃34; button＆＃34;标签？像这样：

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

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

另一个情况问题：

三个＆＃34;按钮式＆lt; a＆gt;标签＆＃34;如下：

提示：

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

原始代码：

<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 - Buttons - When to use what

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

Answer 2

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

它源于将自定义样式应用于锚点更容易的时间。您可以轻松构建自动调整大小的＆＃34;按钮＆＃34;通过在锚本身内使用更多元素来锚定。

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

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

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

修改：

通过编辑您的问题，很明显您只需使用普通href的锚点即可。我没有理由使用onclick或button，而 只是制作一个简单的超链接，这是什么锚点。< / p>