Document.forms
Document
インターフェイスの forms
プロパティは読み取り専用で、文書内に含まれるすべての <form>
を列挙した HTMLCollection
を返します。
メモ: 同様に、HTMLFormElement.elements
プロパティを使用すると、フォームコンポーネントのユーザー入力要素のリストにアクセスすることができます。
構文
collection = document.forms;
値
文書のすべてのフォームを列挙する HTMLCollection
オブジェクトです。コレクションのそれぞれの項目は、単一の <form>
要素を表す HTMLFormElement
です。
文書にフォームがない場合、返されるコレクションは空で、長さはゼロです。
例
フォーム情報の取得
<!DOCTYPE html>
<html lang="en">
<head>
<title>document.forms example</title>
</head>
<body>
<form id="robby">
<input type="button" onclick="alert(document.forms[0].id);" value="robby's form" />
</form>
<form id="dave">
<input type="button" onclick="alert(document.forms[1].id);" value="dave's form" />
</form>
<form id="paul">
<input type="button" onclick="alert(document.forms[2].id);" value="paul's form" />
</form>
</body>
</html>
フォーム内要素の取得
var selectForm = document.forms[index];
var selectFormElement = document.forms[index].elements[index];
名前付きフォームへのアクセス
<!DOCTYPE html>
<html lang="en">
<head>
<title>document.forms example</title>
</head>
<body>
<form name="login">
<input name="email" type="email">
<input name="password" type="password">
<button type="submit">Log in</button>
</form>
<script>
var loginForm = document.forms.login; // Or document.forms['login']
loginForm.elements.email.placeholder = 'test@example.com';
loginForm.elements.password.placeholder = 'password';
</script>
</body>
</html>
仕様書
Specification |
---|
HTML Standard # dom-document-forms-dev |
ブラウザーの互換性
BCD tables only load in the browser
関連情報
- HTML forms
<form>
およびHTMLFormElement
インターフェイス