HTML/CSS - 按钮 - 何时使用哪种按钮

Question

我在HTML页面上有一个关于按钮的基础问题。

我们知道，有几种创建它们的可能性。可以在标签上设置display:block;，这样就可以为其分配颜色、宽度和高度。但是还有HTML元素button和submit元素。

什么时候使用什么？例如，在创建表单时，如果我没记错的话，就需要一个submit元素。但是当我在表单外部有一个按钮时，我可以使用普通的a。但是，我仍然不知道何时使用button。

你能帮我解决一下吗？

- Sven

Answer 1

如果是一个链接，而不是表单提交，应该使用锚点（<a>）。

搜索引擎爬虫无法跟随由input或button提交的链接，只能跟随a。因此，为了SEO方面的考虑，最好使用锚点作为链接。

如果是表单，应该始终使用button或input，因为这些可以在按下回车键时提交表单（与链接不同），并且通常对可访问性更好。

关于使用button或input的详细信息，我不会进行详细解释，因为已经有一篇详细的帖子：

<button> vs.<input type="button" />。哪个更好？

- Curtis

Answer 2

<button>

按钮是HTML元素，表示可点击的按钮。

<a>

HTML锚元素(<a>)定义了超链接、超链接的命名目标或两者都包含的目标。

- Ahsan Khurshid

Answer 3

最近我一直在使用按钮作为JavaScript钩子，如果将事件处理程序附加到按钮而不是锚元素感觉更合适。

锚标签代表一个位置，而对我来说，按钮更像是一个动作。我一直在使用按钮作为幻灯片导航，显示/隐藏内容和执行ajax请求的方式。 :D

- Alastair Hodgson

Answer 4

在表单中，您应该使用适当的元素。

'a' 在表单中并不是很合适。

例如，在 W3C 的主要元素目标中查看。

因为您可以选择任何元素，并使用 CSS 或 JS 更改其行为和用途...这样做非常糟糕。（用法、可访问性、理解）

- N4553R

Answer 5

根据w3Schools.com，

定义和用法

<button>标签定义了一个可点击的按钮。

在<button>元素内部，您可以放置内容，如文本或图像。 这是该元素与使用<input>元素创建的按钮之间的区别。

提示：始终为<button>元素指定类型属性。 不同的浏览器使用<button>元素的不同默认类型。

还有：

提示和注释

注意：如果您在HTML表单中使用<button>元素，则不同 浏览器可能会提交不同的值。在HTML表单中使用<input>创建按钮。

从我的观察来看，<button> 标签的使用意图是在表单之外，而 <input type="button"> 在表单内使用。

默认情况下，两者都被呈现为浏览器用于渲染<input type="button">，与标签不同。

- Maen

---

请不要使用w3schools作为可靠的信息来源，因为他们以确保其内容正确/最新而闻名不如意。 - Simon West

抱歉，我不知道w3school已经被Web开发人员主动弃用。下次我会尽量不引用它们而使用其他参考资料。但是，仅仅因为它上面有一些误导性的内容，并不意味着所有的东西都是错误的，对吧？ - Maen