Value属性とは何ですか？

Value属性は、HTML要素に様々な情報を付加するための属性です。具体的には、入力コントロールの初期値やラベル、オブジェクトに与えるパラメータ、順序付きリストの項目番号などを設定するために使用されます。

入力コントロールにおけるValue属性

<input>要素などの入力コントロールを持つ要素では、value属性に任意の値や文字列を指定することで、初期値やラベルを設定することができます。

<input type="text" name="username" value="ユーザー名を入力してください">

上記コードの場合、テキストフィールドには初期値として「ユーザー名を入力してください」と表示されます。

<input type="checkbox" name="agreement" value="yes">同意します

上記コードの場合、チェックボックスにチェックが入った状態で送信されると、name属性に"agreement"、value属性に"yes"という値がサーバーに送信されます。

Value属性は、入力コントロール以外の要素でも使用されます。例えば、<li>要素では、順序付きリストの項目番号を指定するために使用されます。

<ol>
  <li value="2">項目2</li>
  <li>項目3</li>
  <li value="5">項目5</li>
</ol>

上記コードの場合、リストは以下のように表示されます。

Value属性は、様々な場面で使用されます。例えば、以下のようなケースが考えられます。

ケース	説明
ユーザー情報編集画面	テキストフィールドにユーザーの現在の名前やメールアドレスなどの情報を初期値として表示する。
アンケートフォーム	ラジオボタンやチェックボックスに選択肢の値を設定する。
ショッピングカート	商品の数量を選択するドロップダウンリストに、在庫数の上限を設定する。

A1: 入力コントロールによっては必須の場合があります。例えば、ラジオボタンやチェックボックスでは、value属性を設定しないと、選択状態がサーバーに送信されません。

A2: 特に制限はありませんが、要素や属性によっては、特定の値しか受け付けない場合があります。

A3: value属性は初期値を設定するのに使用し、placeholder属性は入力欄が空の場合に表示されるヒントテキストを設定するために使用します。

その他の参考記事:jquery value 取得