＆lt; form＆gt;のアクションとメソッドの属性は何ですかタグ？-htmlチュートリアル-php.cn

＆lt; form＆gt;のアクションとメソッドの属性は何ですかタグ？

Emily Anne Brown

リリース： 2025-03-19 15:04:35

オリジナル

792 人が閲覧しました

タグのアクションとメソッドの属性は何ですか？

HTMLの<form></form>タグは、ユーザー入力のHTMLフォームを作成するために使用されます。このタグの2つの重要な属性は、 actionとmethodの属性です。

アクション属性： action属性は、フォームが送信されたときにフォームデータを送信する場所を指定します。 URLをその値として使用します。このURLは、HTMLドキュメントと同じサーバーまたは別のサーバー上にあります。 action属性が指定されていない場合、フォームデータはフォームを含むHTMLドキュメントのURLに送信されます。
メソッド属性： method属性は、フォームデータを送信するときに使用するHTTPメソッドを定義します。 GETまたはPOST 2つの値のいずれかを持つことができます。 GETメソッドは、フォームデータをaction属性で指定したURLに追加します? 。 POSTメソッドは、HTTP要求本体の一部としてフォームデータを送信しますが、これはURLには表示されません。 GETとPOSTの選択は、データの性質とそのデータの意図した処理に依存します。

アクション属性は、フォームデータが送信される場所をどのように決定しますか？

<form></form>タグのaction属性は、フォームデータを処理のための正しい宛先に向ける上で重要な役割を果たします。フォームが送信されると、ブラウザはHTTP要求を作成し、 action属性で指定されたURLに送信します。このURLは、絶対的なURL（ https://example.com/process-formなど）または相対URL（例えば、 /process-form ）にすることができます。

プロセスの仕組みは次のとおりです。

フォームの提出：ユーザーが送信ボタンをクリックすると、ブラウザはフォーム送信プロセスを開始します。
HTTP要求構築：ブラウザはmethod属性によって指定されたメソッドを使用してHTTP要求を構築します。フォームデータは、メソッド（ GETまたはPOST ）に従ってエンコードされます。
サーバーへのデータの送信：フォームデータを含むHTTP要求は、 action属性で指定されたURLに送信されます。
サーバー処理：指定されたURLのサーバーは要求を受信し、サーバー側のアプリケーションのロジックに従ってフォームデータを処理します。

正しいaction URLを指定することにより、開発者はフォームデータが、同じサーバー上のページであろうと外部サービスであろうと、処理のために意図したエンドポイントに到達するようにします。

Form SubmissionsのGETメソッドとポストメソッドの違いは何ですか？

GETおよびPOSTメソッドは、HTMLでフォームデータを送信する主な方法であり、それぞれに異なる特性とユースケースがあります。

メソッドを取得：
- データエンコーディング：データは、クエリパラメーターとしてURLに追加されます? 。たとえば、フォームデータにname=John&age=30が含まれている場合、URLはhttps://example.com/process-form?name=John&age=30のように見える場合があります。
- 可視性：データはURLに表示されます。これは、機密データが送信されている場合にセキュリティの懸念事項になる可能性があります。
- ブックマークとキャッシュ：データはURLの一部であるため、GETリクエストはブラウザによってブックマークされ、キャッシュされます。
- データ制限： URLの長さの制限により、通常は2048文字前後のデータの量に制限があります。
- iDempotency： Get RequestsはiDempotentです。つまり、複数の同一のリクエストが単一のリクエストと同じ効果を持つ必要があります。
投稿方法：
- データエンコーディング：データはHTTP要求本体の一部として送信されますが、これはURLには見えません。
- 可視性：データはURLには表示されないため、機密データを送信するには安全性が高まります。
- ブックマークとキャッシュ：投稿リクエストは、通常、ブラウザによってブックマークまたはキャッシュされていません。
- データの制限：送信できるデータの量に制限はありません。これは、大規模なデータ送信に適しています。
- idempotency：投稿リクエストはidempotentではありません。つまり、複数の同一のリクエストには異なる効果がある場合があります。

GETとPOSTを選択することは、フォームの目的によって異なります。 GET 、データの取得や、データを非表示にする必要のないフォームに適していますが、機密データを送信したり、サーバー状態を変更するアクションを実行したり、大量のデータを送信するフォームにはPOSTが優先されます。

その機能を強化するために、

タグで使用できる他のどの属性を使用できますか？

その機能とユーザーエクスペリエンスを強化するために、 <form></form>タグで他のいくつかの属性を使用できます。ここに重要な属性のいくつかがあります：

名前：フォームの名前を指定します。これは、JavaScriptがフォームを参照するのに役立ちます。例： <form name="myForm"></form> 。
ID： CSSおよびJavaScriptで使用できる一意の識別子をフォームに割り当てます。例： <form id="contactForm"></form> 。
enctype：フォームデータのエンコードを送信する方法を指定します。一般的な値は次のとおりです。
- application/x-www-form-urlencoded （デフォルト）：標準エンコーディング。
- multipart/form-data ：フォームにファイルアップロードが含まれている場合に必要です。
- text/plain ：プレーンテキストの提出にはめったに使用されません。
ターゲット：フォームを送信した後に受信される応答を表示する場所を指定します。一般的な値は次のとおりです。
- _self （デフォルト）：同じウィンドウ/タブで開きます。
- _blank ：新しいウィンドウ/タブで開きます。
- _parent ：親フレームで開きます。
- _top ：ウィンドウの全身で開きます。
オートコンプリート：フォームにオートコンプリートを有効にする必要があるかどうかを制御します。値はon （デフォルト）またはoff 。例： <form autocomplete="off"></form> 。
NOVALIDATE：提出時にフォームを検証しないでください。例： <form novalidate></form> 。
Accept-Charset：フォームの提出に使用する文字エンコーディングを指定します。例： <form accept-charset="UTF-8"></form> 。