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

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

フォーム

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で選択の初期状態を調べよう!

♦.defaultChecked 初期チェック状態を参照 ♦.options[参照番号].defaultSelected 初期選択状態を参照 ♦・・・Elem …

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

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

JavaScriptで自動的にフォーカスを移動させてみよう!

★.click() クリックする ★.blur() フォーカスを外す ★.focus() フォーカスを合わせる ★.select() 文字を選択状態にする ★・・・Elementオブジェクト(エレメン …

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

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

JavaScriptでターゲット名を設定しよう!

★.target ターゲット名を参照/設定 スポンサーリンク ★・・・Formオブジェクト(フォーム名またはforms[参照番号])     form要素の各属 …

S