input type =“ submit”とbuttonタグは交換可能ですか？

input type="submit"とbuttonタグは交換可能ですか？または、違いがある場合は、いつ使用しinput type="submit"、いつ使用しbuttonますか？

そして、違いがない場合、なぜ同じ目的で2つのタグがあるのでしょうか。

http://www.w3.org/TR/html4/interact/forms.html#h-17.5

BUTTON要素で作成されたボタンは、INPUT要素で作成されたボタンと同じように機能しますが、より豊かなレンダリングの可能性を提供します。BUTTON要素にはコンテンツがある場合があります。たとえば、画像を含むBUTTON要素は、「画像」に設定されたINPUT要素と同様に機能する可能性がありますが、BUTTON要素の種類はコンテンツを許可します。

したがって、機能性のみが交換可能です！

（忘れないでください。これtype="submit"はのデフォルトなbuttonので、オフにしてください！）

<input type="button">ただボタンであり、それ自体で何もしません。は<input type="submit">、フォーム要素内にある場合、クリックするとフォームを送信します。

別の便利な「特別な」ボタンは<input type="reset">、フォームをクリアするボタンです。

<input type = "button" ..>の代わりに<button>タグを使用します。これは、ブートストラップ3で推奨される方法です。

http://getbootstrap.com/css/#buttons-tags

「クロスブラウザレンダリング

ベストプラクティスとして、可能な場合は常に<button>要素を使用して、ブラウザー間のレンダリングが一致するようにすることを強くお勧めします。

特に、Firefoxのバグがあり、<input>ベースのボタンの行の高さを設定できないため、Firefoxの他のボタンの高さと正確に一致しません。」

どちらの要素でも機能的には同じ結果が得られますが<button> *、以下を使用することを強くお勧めします。

• はるかに明確で読みやすい。 inputコントロールが編集可能であるか、ユーザーが編集できることを示唆しています。buttonそれが果たす目的の点ではるかに明確です
• CSSでのスタイル設定が簡単です。上記のように、FIrefoxとIEにはinput[type="submit"]、場合によっては正しく表示されない癖があります
• 予測可能なリクエスト：値がサーバーへのPOST/ GETリクエストで送信されると、IEは動作を非常に強くします
• マークアップに対応。ボタン内にアイコンなどのアイテムをネストできます。
• HTML5、前向きな考え。開発者として、公式化された新しい仕様を採用するのは私たちの責任です。現在、HTML5は1年以上公式に公開されており、多くの場合、SEOを向上させることが示されています。

* _{デフォルトで指定された動作がない場合を除きます。<button type="button">}

要約すると、私はの使用を強くお勧めしません<input type="submit" />。

<input type='submit' />単一の自己終了タグであるため、内部のHTMLはサポートされていません。<button>一方、はタグペアであるため、HTMLや画像などを内部でサポートしています<button><img src='myimage.gif' /></button>。<button>CSSスタイリングに関しては、より柔軟です。

の欠点は<button>、古いブラウザでは完全にはサポートされていないことです。たとえば、IE6 / 7では正しく表示されません。

特定の理由がない限り、に固執するのがおそらく最善<input type='submit' />です。

これは古い質問だと思いますが、mozilla.orgで見つけて当てはまると思います。

ボタンには、送信、リセット、ボタンの3つのタイプがあります。送信ボタンをクリックすると、要素のaction属性で定義されたWebページにフォームのデータが送信されます。

リセットボタンをクリックすると、すべてのフォームウィジェットがすぐにデフォルト値にリセットされます。UXの観点からは、これは悪い習慣と見なされます。

ボタンボタンをクリックしても、何も起こりません。ばかげているように思えますが、JavaScriptを使用してカスタムボタンを作成するのは驚くほど便利です。

https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Forms/My_first_HTML_form#And_a_<button>_to_finish

<button>はより新しく<input type="submit">、よりセマンティックで、スタイル設定が簡単で、HTMLをサポートしています。

他の答えは素晴らしいですし、質問に答えますが、input type="submit"およびを使用するときに考慮すべきことが1つありbuttonます。input type="submit"あなたが使用することはできません入力にCSS擬似要素をしかし、あなたができるボタンのための！

これはbutton、スタイリングに関して入力よりも要素を使用する理由の1つです。

これがバグなのか機能なのかはわかりませんが、私が見つけた非常に重要な（少なくとも場合によっては）違いがあります。<input type="submit">リクエストにキーと値のペアを作成しますが、作成<button type="submit">しません。ChromeとSafariでテスト済み。

したがって、フォームに複数の送信ボタンがあり、どのボタンがクリックされたかを知りたい場合はbutton、使用せずに、input type="submit"代わりに使用してください。

について話している場合<input type=button>、フォームは自動的に送信されません

<button>タグについて話している場合、それはより新しいものであり、すべてのブラウザーで自動的に送信されるわけではありません。

結論として、すべてのブラウザーでクリック時にフォームを送信したい場合は、 <input type="submit">