<button>与<inputtypes=“button”/>。 使用哪个？
当看大多数网站（包括SO）时，大多数使用：
<input type="button" /> 代替：
<button></button>
- 两者之间的主要区别是什么？
- 有没有正当理由使用一个而不是另一个？
- 有没有合理的理由使用它们？
- 使用
<button>是否带有兼容性问题，看到它不是非常广泛的使用？
- 这里有一个页面描述的差异（基本上你可以把HTML到一个
<button></button>） - 另一个页面描述了为什么人们避免
<button></button>（提示：IE6）
使用<button />时出现另一个IE问题：
当我们谈论IE浏览器时，会遇到一些与button宽度有关的错误。 当你试图添加样式的时候，它会神秘地添加额外的填充，这意味着你必须添加一个小小的黑客来控制事情。
正如一个侧面说明， <button>将隐式提交，如果您想在未提交的情况下使用表单中的button，则会导致问题。 因此，使用<input type="button"> （或<button type="button"> ）的另一个原因是
编辑 – 更多细节
没有types， button隐式地接收types的submit 。 在表单中有多less个提交button或input并不重要，其中任何一个显式或隐式键入为提交，点击后都会提交表单。
有3种支持types的button
submit || "submits the form when clicked (default)" reset || "resets the fields in the form when clicked" button || "clickable, but without any event handler until one is assigned"
这篇文章似乎提供了一个相当不错的概述。
来自页面：
使用BUTTON元素创build的button就像使用INPUT元素创build的button一样，但它们提供了更丰富的呈现可能性：BUTTON元素可能具有内容。 例如，包含图像的BUTTON元素的function类似于INPUT元素，其types设置为“image”，但BUTTON元素types允许内容。
button元素 – W3C
引用
重要提示：如果您在HTML表单中使用button元素，则不同的浏览器将提交不同的值。 Internet Explorer将在
<button>和</button>标签之间提交文本，而其他浏览器将提交value属性的内容。 使用input元素在HTML表单中创buildbutton。
来自： http : //www.w3schools.com/tags/tag_button.asp
如果我理解正确，答案是从浏览器到浏览器的兼容性和input一致性
在一个<button>元素里，你可以放置内容，如文本或图像。
<button type="button">Click Me!</button>
这是这个元素和用<input>元素创build的button之间的区别。
如果要在表单中创buildbutton，请使用input元素中的button。 如果你想创build一个动作的button，使用button标签。
在HTML手册中引用Forms页面 ：
使用BUTTON元素创build的button就像使用INPUT元素创build的button一样，但它们提供了更丰富的呈现可能性：BUTTON元素可能具有内容。 例如，包含图像的BUTTON元素的function类似于INPUT元素，其types设置为“image”，但BUTTON元素types允许内容。
我将引用文章“锚点，input和button之间的差异 ：
锚点 （ <a>元素）代表超链接，一个人可以导航到或在浏览器中下载的资源。 如果你想让你的用户移动到一个新的页面或下载一个文件，然后使用一个锚点。
一个input （ <input> ）代表一个数据字段：所以有些用户数据意味着要发送到服务器。 有几种与button相关的inputtypes： <input type="submit"> ， <input type="image"> ， <input type="file"> ， <input type="reset"> ， <input type="button"> 。
它们每个都有一个含义，例如“ 文件 ”用于上传文件，“ 重置 ”清除表单，“ 提交 ”将数据发送到服务器。 在MDN或W3School 上检查W3参考。
button （ <button>)元素是相当通用的：
- 您可以嵌套button中的元素，如图像，段落或标题;
- button也可以包含
::before和::after伪元素; - button支持
disabled属性。 这可以很容易地打开和closures它们。
再次检查MDN上或W3School 上的 <button>标记的W3引用。
如果您使用jQuery，则会有很大的区别。 jQuery知道input的事件多于button上的事件。 在button上，jQuery只知道“点击”事件。 在input上，jQuery知道“点击”，“焦点”和“模糊”事件。
您可以随时将事件绑定到您的button，但请注意，jQuery自动识别的事件是不同的。 例如，如果您创build了一个在页面上出现“focusin”事件时执行的函数，则input将触发该函数，但button不会。
<button>非常灵活，可以包含HTML。 而且，使用CSS进行样式devise要容易得多，而且样式实际上可以在所有浏览器中应用。 但是，有关Internet Explorer（Eww！IE！）的一些缺点。 Internet Explorer不能正确检测值属性，使用标记的内容作为值。 无论button是否被点击，表单中的所有值都被发送到服务器端。 这使得它作为一个<button type="submit">棘手和痛苦。
另一方面， <input type="submit">没有任何值或检测问题，但是不能像<button>那样添加HTML。 样式也很难，样式在所有浏览器中都不会很好地响应。 希望这有助于。
就CSS样式而言， <button type="submit" class="Btn">Example</button>更好，因为它使您能够使用CSS :before和:after 伪类可以提供帮助。
由于在某些情况下使用类进行样式化时， <input type="button">可视化呈现不同于<a>或<span> ，所以我会避免它们。
非常值得注意的是， 当前的最佳答案是在2009年编写的。现在IE6并不是一个值得关注的问题，所以在我看来，样式一致性在我看来是<button type="submit">Wins</button> 。
另外，其中一个差异可能来自图书馆的提供者，以及他们的代码。 例如在这里，我使用cordova平台结合移动angular度用户界面，而input/ div / etc标签与ng-click很好地工作，button可以导致Visual Studiodebugging程序崩溃，当然由差异，程序员造成的; 请注意，马特答案指向同样的问题，jQuery只是一个库，提供者没有想到一个元素上的某些function，他/他提供了另一个。 所以当你使用图书馆的时候，你可能会遇到一个问题，你不会面对另一个问题。 而只是像input一样stream行的，大多数是固定的，只是因为它更受欢迎。
我只想在这里添加一些答案。 input元素被认为是空的或无效的元素（其他空元素是区域，基地，br，col，hr，img，input，链接，meta和param，你也可以在这里查看 ），意思是不能有任何内容。 除了没有任何内容之外，空元素不能有像:: after和:: before之类的伪元素 ，这是我认为的一个主要缺点。
<button>
- 默认情况下，就像它有一个“type =”submit“属性一样
- 可以没有forms和forms使用。
- 允许使用文字或HTML内容
- CSS允许伪元素（如：之前）
- 标签名称通常对于单个表单是唯一的
与
<input type='button'>
- types应设置为“提交”以performance为提交元素
- 只能用于forms。
- 只允许文本内容
- 没有CSS的伪元素
- 与大多数表单元素（input）相同的标签名称
–
在现代浏览器中，这两个元素都很容易用CSS来devise，但是在大多数情况下， button元素是首选，因为你可以使用inner html和伪元素
