現役システムエンジニアの備忘録

技術スキルや用語などの記録を残していきます

フォーム

JavaScriptでフォームの部品を参照しよう!

投稿日:2019年6月3日 更新日:

★.エレメント エレメントを参照
★.elements[参照番号] エレメントを参照
★.length エレメントの数を参照
♦.length エレメントの数を参照
♦.type エレメントの種類を参照
♦.name エレメントの名前を参照

★・・・Formオブジェクト(フォーム名またはforms[参照番号])
♦・・・Elementオブジェクト(エレメント名またはelements[参照番号])

ボタン、チェックボックス、選択メニューなどのフォームの各部品をエレメントといいます。

スポンサーリンク

elementsオブジェクト

エレメントを参照するには、エレメントの名前(エレメント名)や参照番号を利用します。エレメント名とは<input>などエレメントを定義する各タグのname属性あるいはid属性で設定されている名前です。たとえば<input type=”text” name=”mail” />と指定されているエレメントを参照する場合は次のようになります。
★.mail
★.elements[“mail”] ★・・・エレメントが含まれるフォーム
参照番号を利用する方法は、フォーム中のエレメントを要素とする配列からその参照番号に対応するエレメントにアクセスします。指定する際はelements[参照番号]という形式になります。エレメントの参照番号は、フォームの中でエレメントが記述されている順番で、0からの連番です。たとえばフォーム中の2番目のエレメントを参照する場合は次のようになります。
★.elements[1] ★・・・エレメントが含まれるフォーム

スポンサーリンク

lengthプロパティ

フォームにあるすべてのエレメントの数を参照します。FormオブジェクトのlengthプロパティとElementの配列のlengthプロパティは同じ値を返します。

typeプロパティ

エレメントの種類を参照します。エレメントには以下の種類があります。

エレメント 意味 エレメント 意味
button ボタン radio ラジオボタン
checkbox チェックボックス reset リセットボタン
fileUpload ファイルアップロード select 選択メニュー
hidden 隠しオブジェクト submit 送信ボタン
options 選択メニューの項目 text 1行の入力フィールド
password パスワード入力欄 textarea 複数行の入力フィールド
スポンサーリンク

-フォーム
-

執筆者:


comment

メールアドレスが公開されることはありません。

関連記事

JavaScriptでフォームの送信先を設定しよう!

★.action 送信先を参照/設定 スポンサーリンク ★・・・Formオブジェクト(フォーム名またはforms[参照番号])     form要素の各属性で指 …

JavaScriptで選択されているか調べてみよう!

★.checked チェック状態を参照/設定 ★.options[参照番号].selected 選択状態を参照 ★・・・Elementオブジェクト(エレメント名またはelements[参照番号]) チ …

JavaScriptでフォームの内容を送信しよう!

★.submit() フォームの内容を送信 スポンサーリンク ★・・・Formオブジェクト(フォーム名またはforms[参照番号]) フォームの内容を送信するメソッドです。submitメソッドを利用し …

JavaScriptでどの項目が選択されているか調べよう!

★.selectedIndex ★・・・Elementオブジェクト(エレメント名またはelements[参照番号]) セレクトメニューで選択されている項目の参照番号を参照します。最初のメニュー項目の参 …

JavaScriptでフォームの送信形式を設定しよう!

★.action 送信先を参照/設定 スポンサーリンク ★・・・Formオブジェクト(フォーム名またはforms[参照番号])     form要素の各属性で指 …