الفرق بين المراجعتين لصفحة: «JavaScript/Document/forms»

من موسوعة حسوب
→ التعديل السابق
مرئينص الويكي
ط تنسيق الصّفحة
طلا ملخص تعديل
 
(مراجعتان متوسطتان بواسطة مستخدمين اثنين آخرين غير معروضتين)
سطر 1: سطر 1:
<noinclude>{{DISPLAYTITLE:<code>Document.forms</code>}}</noinclude>
<noinclude>{{DISPLAYTITLE:<code>Document.forms</code>}}</noinclude>
تُعيد الخاصّية <code>forms</code> مجموعة من النّوع  <code>HTMLCollection</code> تحتوي على جميع عناصِر [[HTML/form|<code><form></code>]] في المُستند.
تُعيد الخاصّية <code>forms</code> مجموعة من النّوع  <code>[[JavaScript/HTMLCollection|HTMLCollection]]</code> تحتوي على جميع عناصِر <code>[[HTML/form|<form>]]</code> في المُستند.


'''ملاحظة:''' يُمكنك كذلك استعمال الخاصيّة [[JavaScript/HTMLFormElement/elements|<code>HTMLFormElement.elements</code>]] للحصول على قائمةٍ بعناصِر نماذج الإدخال بشكلٍ مُشابه.
'''ملاحظة:''' يُمكنك كذلك استعمال الخاصيّة <code>[[HTMLFormElement/elements|HTMLFormElement.elements]]</code> للحصول على قائمةٍ بعناصِر نماذج الإدخال بشكلٍ مُشابه.


==البنية العامة==
==البنية العامة==
سطر 10: سطر 10:


===القيمة===
===القيمة===
كائنٌ من النّوع  <code>HTMLCollection</code> يُمثّل قائمةً بجميع النّماذج في المُستند. كلّ عنصر من المجموعة يُعدّ من النّوع <code>HTMLFormElement</code> ويُمثّل عنصر <code>[[HTML/form|<form>]]</code> وحيد.
كائنٌ من النّوع  <code>HTMLCollection</code> يُمثّل قائمةً بجميع النّماذج في المُستند. كلّ عنصر من المجموعة يُعدّ من النّوع <code>[[JavaScript/HTMLFormElement|HTMLFormElement]]</code> ويُمثّل عنصر <code>[[HTML/form|<form>]]</code> وحيد.


إن لم يوجد أي نموذج في المُستند، فالمجموعة المُعادة ستكون فارغة بطولٍ يُساوي صفرًا.
إن لم يوجد أي نموذج في المُستند، فالمجموعة المُعادة ستكون فارغة بطولٍ يُساوي صفرًا.
سطر 16: سطر 16:
==أمثلة==
==أمثلة==
الحصول على معلومات نموذج مُعيّن:
الحصول على معلومات نموذج مُعيّن:
<syntaxhighlight lang="javascript">
<syntaxhighlight lang="html">
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<html lang="en">
  <head>
    <title>document.forms</title>
  </head>
  <body>
    <form id="ahmed">
      <input type="button" onclick="alert(document.forms[0].id);" value="ahmed's form">
    </form>


<head>
    <form id="osama">
<title>document.forms example</title>
      <input type="button" onclick="alert(document.forms[1].id);" value="osama's form">
</head>
    </form>


<body>
    <form id="raghad">
 
      <input type="button" onclick="alert(document.forms[2].id);" value="raghad's form">
<form id="robby">
    </form>
  <input type="button" onclick="alert(document.forms[0].id);" value="robby's form" />
   </body>
</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>
</html>
</syntaxhighlight>
</syntaxhighlight>
سطر 47: سطر 43:
</syntaxhighlight>
</syntaxhighlight>
الوصول إلى النماذج عبر أسمائها:
الوصول إلى النماذج عبر أسمائها:
<syntaxhighlight lang="javascript">
<syntaxhighlight lang="html">
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<html lang="en">
<head>
  <head>
  <title>document.forms example</title>
    <title>document.forms</title>
</head>
  </head>
  <body>
    <form name="login">
      <input name="email" type="email">
      <input name="password" type="password">
      <button type="submit">Log in</button>
    </form>


<body>
    <script>
 
      var loginForm = document.forms.login; // أو document.forms['login']
<form name="login">
      loginForm.elements.email.placeholder = 'test@example.com';
  <input name="email" type="email">
      loginForm.elements.password.placeholder = 'password';
  <input name="password" type="password">
    </script>
   <button type="submit">Log in</button>
   </body>
</form>
</html>


<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>
</syntaxhighlight>
</syntaxhighlight>


==انظر أيضا==
==انظر أيضًا==
* [[HTML#.D8.A7.D9.84.D9.86.D9.85.D8.A7.D8.B0.D8.AC|نماذج HTML]]
* [[:تصنيف:HTML Forms|نماذج HTML]].
* [[HTML/form|العنصر form]]
* العنصر <code>[[HTML/form|<form>]]</code>.
==مصادر ومواصفات==
==مصادر ومواصفات==
* مواصفة [https://html.spec.whatwg.org/multipage/#dom-document-forms HTML Living Standard].
* مواصفة [https://html.spec.whatwg.org/multipage/#dom-document-forms HTML Living Standard].

المراجعة الحالية بتاريخ 14:29، 7 أكتوبر 2022

تُعيد الخاصّية forms مجموعة من النّوع HTMLCollection تحتوي على جميع عناصِر <form> في المُستند.

ملاحظة: يُمكنك كذلك استعمال الخاصيّة HTMLFormElement.elements للحصول على قائمةٍ بعناصِر نماذج الإدخال بشكلٍ مُشابه.

البنية العامة

collection = document.forms;

القيمة

كائنٌ من النّوع HTMLCollection يُمثّل قائمةً بجميع النّماذج في المُستند. كلّ عنصر من المجموعة يُعدّ من النّوع HTMLFormElement ويُمثّل عنصر <form> وحيد.

إن لم يوجد أي نموذج في المُستند، فالمجموعة المُعادة ستكون فارغة بطولٍ يُساوي صفرًا.

أمثلة

الحصول على معلومات نموذج مُعيّن: 

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>document.forms</title>
  </head>
  <body>
    <form id="ahmed">
      <input type="button" onclick="alert(document.forms[0].id);" value="ahmed's form">
    </form>

    <form id="osama">
      <input type="button" onclick="alert(document.forms[1].id);" value="osama's form">
    </form>

    <form id="raghad">
      <input type="button" onclick="alert(document.forms[2].id);" value="raghad'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</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; // أو document.forms['login']
      loginForm.elements.email.placeholder = 'test@example.com';
      loginForm.elements.password.placeholder = 'password';
    </script>
  </body>
</html>

انظر أيضًا

مصادر ومواصفات

مجلوبة من «https://wiki.hsoub.com/index.php?title=JavaScript/Document/forms&oldid=32412»