JavaScript свойство Document.forms

Определение и применение

JavaScript свойство forms объекта Document возвращает коллекцию HTMLCollection со списком всех элементов <form>, содержащихся в текущем документе.

Поддержка браузерами

Спецификация: multipage

Поддерживается во всех основных браузерах с 2018 года.

ВсеКомпьютерыМобильные

Совместимостьapi.Document.forms
Возможность	Компьютеры					Мобильные
Возможность	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on iOS	Samsung Browser	WebView Android	WebView on iOS
`forms`	✓1	✓12	✓61 Версия 61 выпущена в 2018 г. Версия 1 выпущена в 2004 г. — Удалено в 61; Частичная поддержка Примечание MDN (англ.) Only supported for `HTMLDocument`, not all `Document` objects.	✓≤12.1	✓4 Версия 4 выпущена в 2009 г. Версия 1 выпущена в 2003 г. — Удалено в 4; Частичная поддержка Примечание MDN (англ.) Only supported for `HTMLDocument`, not all `Document` objects.	✓18	✓61 Версия 61 выпущена в 2018 г. Версия 4 выпущена в 2011 г. — Удалено в 61; Частичная поддержка Примечание MDN (англ.) Only supported for `HTMLDocument`, not all `Document` objects.	✓≤12.1	✓3.2 Версия 3.2 выпущена в 2010 г. Версия 1 выпущена в 2007 г. — Удалено в 3.2; Частичная поддержка Примечание MDN (англ.) Only supported for `HTMLDocument`, not all `Document` objects.	✓1.0	✓4.4	✓3.2 Версия 3.2 выпущена в 2010 г. Версия 1 выпущена в 2007 г. — Удалено в 3.2; Частичная поддержка Примечание MDN (англ.) Only supported for `HTMLDocument`, not all `Document` objects.

поддерживаетсяс ограниченияминет поддержкинет данных≤31 — не позднее версии 31

JavaScript синтаксис

JavaScript

const forms = document.forms; // Живая коллекция, свойство только для чтения.

Спецификация

Пример использования

Поиск формы и чтение её поля

Нажмите ▶: в консоли появятся число форм в документе (1) и значение поля username, найденного через forms.namedItem('login'). Измените значение поля в index.html и сравните.

index.html

HTML

<form id="login">
  <label>Имя <input name="username" value="Анна" /></label>
</form>

main.js

JavaScript

const form = document.forms.namedItem('login')
console.log(document.forms.length)
console.log(form.elements.namedItem('username').value)

style.css

CSS

body {
  margin: 16px;
  font:
    16px/1.5 system-ui,
    sans-serif;
  overflow-wrap: anywhere;
}
img,
input,
select,
textarea,
button {
  max-width: 100%;
}