The forms
read-only property of the Document
interface returns an HTMLCollection
listing all the <form>
elements contained in the document.
Note: Similarly, you can access a list of a form's component user input elements using the HTMLFormElement.elements
property.
Value
An HTMLCollection
object listing all of the document's forms. Each item in the collection is a HTMLFormElement
representing a single <form>
element.
If the document has no forms, the returned collection is empty, with a length of zero.
Examples
<!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>
const selectForm = document.forms[index];
const 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>
const loginForm = document.forms.login;
loginForm.elements.email.placeholder = "[email protected]";
loginForm.elements.password.placeholder = "password";
</script>
</body>
</html>
Specifications
Browser compatibility
|
Desktop |
Mobile |
|
Chrome |
Edge |
Firefox |
Internet Explorer |
Opera |
Safari |
WebView Android |
Chrome Android |
Firefox for Android |
Opera Android |
Safari on IOS |
Samsung Internet |
forms |
1 |
12 |
1 |
4 |
≤12.1 |
1 |
4.4 |
18 |
4 |
≤12.1 |
1 |
1.0 |
See also