Skip to content

Latest commit

 

History

History
101 lines (77 loc) · 2.52 KB

index.md

File metadata and controls

101 lines (77 loc) · 2.52 KB
Raw
title short-title slug l10n
Document: forms プロパティ
forms
Web/API/Document/forms
sourceCommit
acfe8c9f1f4145f77653a2bc64a9744b001358dc

{{APIRef("DOM")}}

forms は {{domxref("Document")}} インターフェイスの読み取り専用プロパティで、文書内に含まれるすべての {{HTMLElement("form")}} を列挙した {{domxref("HTMLCollection")}} を返します。

Note

同様に、{{domxref("HTMLFormElement.elements")}} プロパティを使用すると、フォームコンポーネントのユーザー入力要素のリストにアクセスすることができます。

値

文書のすべてのフォームを列挙する {{domxref("HTMLCollection")}} オブジェクトです。このコレクションのそれぞれの項目は、単一の <form> 要素を表す {{domxref("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>

フォーム内要素の取得

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; // Or document.forms['login']
      loginForm.elements.email.placeholder = "test@example.com";
      loginForm.elements.password.placeholder = "password";
    </script>
  </body>
</html>

仕様書

{{Specifications}}

ブラウザーの互換性

{{Compat}}

関連情報

  • HTML フォーム
  • {{HTMLElement("form")}} および {{domxref("HTMLFormElement")}} インターフェイス