نتائج البحث
اذهب إلى التنقل
اذهب إلى البحث
العنصر
العنصر
العناصر
العنصر
Document.cookie
تُستعمل هذه الخاصيّة للحصول على ملفّات الارتباط (cookies) المُرتبطة بالمُستند الحالي وضبطها، للتعامل مع ملفّات الارتباط ببساطة أكثر، انظر إطار العمل البسيط هذا. البنية العامة الحصول على جميع ملفّات تعريف الارتباط المتاحة allCookies = document.cookie;
المُتغيّر allCookies أعلاه عبارة عن سلسلة نصيّة تحتوي على قائمة بجميع ملفات الارتباط مفصولة بفاصلة منقوطة (;)، وهي على شكل مفتاح=قيمة. ضبط ملفّ ارتباط جديد document.cookie = newCookie;
في الشيفرة أعلاه، المُتغيّر newCookie عبارة عن سلسلة نصيّة على شكل مفتاح=قيمة. لاحظ أنّك تستطيع أن تضبط أو تُحدّث ...
الكائن jQuery.cssHooks() في jQuery
jQuery.cssHooks القيم المعادة يعيد كائنًا من النوع Object. الوصف يتعلَّق هذا التابع بـ jQuery مباشرةً للتحكم بكيفيَّة استعادة أو ضبط قيم خاصِّيَّات CSS محدَّدة، أو توحيد أسماء خاصِّيَّات CSS، أو إنشاء خاصِّيَّات CSS مخصَّصة. jQuery.cssHooks أُضيف مع الإصدار: 1.4.3. يوفِّر الكائن $.cssHooks طريقةً لتعريف دوالٍ من أجل جلب أو ضبط قيم خاصِّيَّات CSS محدَّدة. يمكن أيضًا أن يُستخدَم لإنشاء cssHooks جديد من أجل توحيد (normalizing) ميزات CSS3 مثل تأثير الظلال على إطار العناصر (box shadows)، والتدرُّجات (gradients). على سبيل المثال، ...
هياكل المكتبات في TypeScript
مقدمة طريقة هيكلة ملفّ التصريحات الخاص بك تعتمد عمومًا على كيفيّة اعتماد المستخدمين على المكتبة. هناك عدّة طرق يُمكن بها توفير المكتبة ليستخدمها الآخرون في JavaScript. وستحتاج إلى كتابة ملفّ تصريحاتٍ ملائم حسب هيكل المكتبة التي ترغب بكتابة ملفّ تصريحات لها. يغطي هذا الدليل كيفيّة التعرّف على أنماط المكتبات الشائعة، وكيفيّة كتابة ملف تصريحاتٍ مناسب لنمط المكتبة. يوجد لكل نمط من أنماط هيكلة المكتبات الشائعة ملفٌّ ملائم له في قسم القوالب. يمكنك البدء بهذه القوالب لكتابة ملف التصريحات بشكل أسرع. ...
الكائن jQuery.cssHooks() في jQuery
jQuery.cssHooks القيم المعادة يعيد كائنًا من النوع Object. الوصف يتعلَّق هذا التابع بـ jQuery مباشرةً للتحكم بكيفيَّة استعادة أو ضبط قيم خاصِّيَّات CSS محدَّدة، أو توحيد أسماء خاصِّيَّات CSS، أو إنشاء خاصِّيَّات CSS مخصَّصة. jQuery.cssHooks أُضيف مع الإصدار: 1.4.3. يوفِّر الكائن $.cssHooks طريقةً لتعريف دوالٍ من أجل جلب أو ضبط قيم خاصِّيَّات CSS محدَّدة. يمكن أيضًا أن يُستخدَم لإنشاء cssHooks جديد من أجل توحيد (normalizing) ميزات CSS3 مثل تأثير الظلال على إطار العناصر (box shadows)، والتدرُّجات (gradients). على سبيل المثال، ...
العنصر
يُمثِّل العنصر <i> جزءًا من النص يجب أن يتميز عن بقية النص لسببٍ ما، مثل المصطلحات التقنية أو العبارات المكتوبة بلغةٍ أجنبية أو التعابير الوجهية لشخصيةٍ ما في مسرحية ...إلخ. ويُعرَض هذا العنصر عادةً بخطٍ مائل. يمكن استخدام العنصر <i> للإشارة إلى كلمات بلغة أجنبية كما في المثال الآتي: <p>أطول كلمة في الإنكليزية هي <i>pneumonoultramicroscopicsilicovolcanoconiosis</i> وهي تعني أحد الأمراض التي تصيب الرئة.</p>
أو للإشارة إلى مصطلح تقني: <p>عند تعلم البرمجة، من المهم أن نولي <i>البرمجة الكائنية</i> اهتمامًا بالغًا.</p>
بطاقة العنصر تصنيفات ...
العنصر
يُمثِّل العنصر <label> لافتةً (caption) لأحد عناصر النماذج. مثال عن عنصر <label> بسيط يوجد داخله أحد عناصر النموذج: <label>لافتة نصية <input type="text"></label>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي وعنصر عادي وعنصر تفاعلي وعنصر مرتبط بالنماذج. المحتوى المسموح العناصر التي يمكن إضافة لافتة لها، ولا يسمح باستخدام العنصر <label> داخله. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي. واجهة DOM HTMLLabelElement دعم المتصفحات Chrome Firefox Edge Safari Opera مدعوم مدعوم مدعوم ...
Document.createNodeIterator()
يُعيد التّابع Document.createNodeIterator() كائنًا جديدًا من النّوع NodeIterator. البنية العامة var nodeIterator = document.createNodeIterator(root, whatToShow, filter);
المعاملات root العقدة الجذر التي سيبدأ منها مرور الكائن NodeIterator. whatToShow قيمة اختياريّةٌ من النّوع unsigned long تُمثّل قيمة bitmask تُنشأُ عبر دمج الخاصيّات الثّابتة الخاصّة بالكائن NodeFilter. وهي طريقة جيّدة لترشيح بعض أنواع العقد. القيمة الافتراضيّة هي 0xFFFFFFFF وتُمثّل الثّابتة SHOW_ALL. الثّابتة القيمة الرّقميّة الوصف NodeFilter.SHOW_ALL -1 (وهي القيمة القصوى للنّوع unsigned long) اعرض جميع العقد. NodeFilter.SHOW_ATTRIBUTE 2 قيمةٌ مُهملَة تعرض عقد الخصائص ...
العنصر
يُستخدَم العنصر <script> لتضمين أو الإشارة إلى سكربت قابل للتنفيذ. مثال عن كيفية استخدام هذا العنصر لتضمين سكربت خارجي في HTML 4 و XHTML: <script type="text/javascript" src="javascript.js"></script>
أما في HTML5 فالفرق بسيط ألا وهو حذف الخاصية type امتثالًا لنصيحة مواصفة HTML5: <script src="javascript.js"></script>
طريقة كتابة سكربت مُضمَّن في المستند: <script>
alert("مرحبًا");
</script>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي أو عنصر وصفي. المحتوى المسموح السكربتات الديناميكية مثل text/javascript. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر ...
العنصر
يُمثِّل العنصر <figure> محتوى مستقل بحد ذاته، ويستخدم عادةً مع لافتة (عبر العنصر <figcaption>)، ويُشير عادةً إلى وحدة لا تتجزأ من المعلومات. بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي. المحتوى المسموح محتوى تنظيمي يتبعه العنصر <figcaption>، أو العنصر <figcaption> يتبعه محتوى تنظيمي، أو محتوى تنظيمي فقط. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLElement دعم المتصفحات Chrome Firefox Edge Safari Opera 8 4.0 مدعوم 5.1 11.10 الخاصيات يمكن ...
العنصر
يُعطي العنصر <em> توكيدًا للنص الموجود فيه، ويمكن تشعّب العنصر <em> (أي استخدام أكثر من عنصر <em> داخل بعضها) وكل مستوى من مستويات التشعب يعطي توكيدًا أكثر للنص. يمكن استخدام العنصر <em> للإشارة إلى اختلاف بين شيئين اثنين كما في المثال الآتي: <p>
موسوعة حسوب تهتم <em>بتوثيق</em>
لغات البرمجة، وليس بتقديم
<em>دروس</em> عنها.
</p>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي. المحتوى المسموح محتوى عادي. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. ...
العنصر
العنصر <hr> يُمثِّل فاصلًا موضوعيًا بين الفقرات (مثلًا: تغيّر المشهد في قصة ما، أو تبدّل الموضوع بإنشاء قسم جديد). كان يُعرَض هذا العنصر في الإصدارات السابقة من HTML على شكل خط أفقي، وصحيحٌ أنَّه ما يزال يعرَض كذلك في المتصفحات، لكن أصبح له معنى هيكلي، بدلًا من كونه عنصرًا شكليًا فقط. يحتوي هذا المثال على فقرتين (العنصر <p>) يفصل بينهما العنصر <hr> الذي يُمثَّل بخطٍ أفقي: <p>
تهدف موسوعة حسوب لتوفير توثيق عربي كامل وعالي الجودة، مدعّم بالأمثلة لمختلف لغات البرمجة ...
العنصر
يستعمل العنصر <li> لتمثيل عنصر في قائمة، ويجب أن يحتوى هذا العنصر في عنصر أب الذي يكون قائمة مرتبة <ol> أو قائمة غير مرتبة <ul> أو قائمة <menu>. تُعرَض عناصر القوائم العادية <menu> والقوائم غير المرتبة وقبلها نقطة (bullet point)، أما في القوائم المرتبة فتعرض عناصرها بترتيبٍ تصاعدي وقبلها رقم أو حرف يدل على ترتيبها. مثال عن قائمة مرتبة <ol> عادية فيها ثلاثة عناصر: <ol>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ol>
مثال عن قائمة مرتبة <ol> يبدأ الترقيم ...
العنصر
يُمثِّل العنصر <article> جزءًا من المستند أو الصفحة أو التطبيق أو الموقع الغرض منها هو القدرة على إعادة توزيعها واستخدامها بشكل مستقل، مثل موضوع في منتدى أو مقالة في صحيفة أو تدوينة. مثال عن استخدام عناصر <article> لتمثيل محتوى المنشور ولتمثيل التعليقات، ويبين هذا المثال كيف يستعمل العنصر <article> مع بقية عناصر HTML: <article>
<h1>موسوعة حسوب</h1>
<p>تهدف موسوعة حسوب لتوفير توثيق عربي كامل وعالي الجودة، مدعّم بالأمثلة لمختلف لغات البرمجة وتقنيات تطوير الويب والجوال. تعتمد الموسوعة على فريق ...
التابع .promise() في jQuery
.promise( [type ] [, target ] ) القيم المعادة يعيد كائنًا من النوع Promise. الوصف يعيد هذا التابع كائنًا من النوع Promise عند انتهاء تنفيذ إجراءات ذات نوع محدَّد جميعها، سواءً كانت في الطابور (queued) أم لا، والمرتبطة بالمجموعة؛ وهذا التابع مفيد لمراقبة إكتمال تنفيذ إجراءات معينة. .promise( [type ] [, target ] ) أُضيف مع الإصدار: 1.6. type سلسلة نصية تمثِّل نوع الطابور المراد مراقبته. قيمته الافتراضية هي fx. target كائن مجرَّد (object) يبين أيًّا من توابع Promise يجب ...
التابع .fadeOut() في jQuery
.fadeOut( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يُخفي هذا التابع العناصر المطابقة عن طريق تحويلها إلى شفافة تدريجيًا. .fadeOut( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .fadeOut( options ) أُضيف مع الإصدار: 1.0. options كائن من النوع Object، ويقدم ...
العنصر
يُحدِّد العنصر <base> أساس روابط URL لجميع الروابط النسبية (relative URLs) الموجودة في المستند. لا يجوز استخدام أكثر من عنصر <base> في المستند. يمكن الوصول إلى رابط URL الأساس في المستند برمجيًا باستخدام document.baseURI. مثال عن استخدام العنصر <base> لعرض صورة لشعار شركة حسوب (باستخدام العنصر <img>)، مع رابط إلى النسخة الإنكليزية من الموقع (باستخدام العنصر <a>): <!DOCTYPE html>
<html>
<head>
<title>HTML base Tag</title>
<base href="http://www.hsoub.com">
</head>
...
العنصر
يُمثِّل العنصر <select> عنصرًا من عناصر النماذج يوفِّر قائمةً من الخيارات. مثال عن العنصر <select> فيه ثلاثة خيارات (توفَّر عبر العنصر <option>) وتم تحديد الخيار الثاني افتراضيًا (عبر الخاصية selected): <select name="select">
<option value="value1">الخيار 1</option>
<option value="value2" selected>الخيار 2</option>
<option value="value3">الخيار 3</option>
</select>
مثال عن العنصر <select> فيه ثلاثة مجموعة من الخيارات (العنصر <optgroup>) ويمكن اختيار أكثر من قيمة فيه (عبر الخاصية multiple) وستُعرَض خمسة أسطر (الخاصية size): <select name="select" size="5" multiple>
<optgroup label="المجموعة 1">
...
العنصر
يُمثِّل العنصر <object> موردًا خارجيًا، والذي يمكن أن يُعامل كصورة، أو كمورد سيُعالَج عبر إضافة خارجية. مثال عن استخدام العنصر <object> لتضمين مقطع بصيغة فلاش (flash، بصيغة swf): <object data="movie.swf" type="application/x-shockwave-flash"></object>
مثال آخر عن تضمين مقطع فلاش، لكن مع تمرير معاملات له عبر العنصر <param>: <object data="movie.swf" type="application/x-shockwave-flash">
<param name="foo" value="bar">
</object>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي أو عنصر يحتوي وسائط مضمّنة أو عنصر تفاعلي. المحتوى المسموح يجوز استخدام العنصر <param> صفر مرة أو أكثر، ثم أي ...
Document.createElementNS()
يُنشئُ التّابع Document.createElementNS() عنصرًا جديدًا بعنوان URI الخاصّ بمجال الأسماء والاسم الموصوف المُحدّدَين. لإنشاء عنصرٍ دون تحديد عنوان URI الخاصّ بمجال الأسماء، استعمل التّابع createElement. البنية العامة var element = document.createElementNS(namespaceURI, qualifiedName[, options]);
المعاملات namespaceURI سلسلةٌ نصيّةٌ تُحدّد عنوان URI الخاصّ بمجال الأسماء لربطه بالعنصر. وتُحدّد قيمةُ الخاصيّة namespaceURI الخاصّة بالعنصر المُنشأ من قيمة هذا المُعامل. انظر عناوين URI الخاصّة بمجال الأسماء الصّالحة أدناه. qualifiedName سلسلةٌ نصيّةٌ تُحدّد نوع العنصر المرغوب إنشاؤه. وتُحدّد قيمةُ الخاصيّة nodeName الخاصّة بالعنصر المُنشأ من ...
المحدد :hidden() في jQuery
المحدد :hidden() الوصف يختار هذا المحدد كل العناصر المخفية. jQuery( ":hidden" ) أُضيف مع الإصدار: 1.0. يمكن للعناصر أن تُعد مخفية لعدة أسباب منها: أن تطبق الخاصية display: none عليها. هي حقول من حقول النماذج التي لها الخاصية type="hidden". ضبطت قيمة طولها وعرضها إلى 0. العنصر الأب مخفي، مما يعني أن العنصر الابن مخفي أيضًا ولا يظهر في الصفحة. العناصر التي لها الخاصية visibility: hidden أو الخاصية opacity: 0 تعدّ مرئية رغم أنها لا تظهر في الشاشة إلا أنها ما ...
المحدد :eq() في jQuery
المحدد :eq() الوصف يُحدد العنصر الموجود في الفهرس n داخل المجموعة المتطابقة. jQuery( ":eq(index)" ) أُضيف مع الإصدار: 1.0. index فهرس صفري للعنصر المراد مطابقته. jQuery( ":eq(-index)" ) أُضيف مع الإصدار: 1.8. indexFromEnd فهرس صفري للعنصر المراد مطابقته، معدود تنازليًا من العنصر الأخير. تقوم المحددات المرتبطة بالفهارس ( :eq() و :lt() و :gt() و :even و :odd ) بترشيح مجموعة العناصر التي طابقت التعبيرات التي تسبقها. وهي تُضيِّق المجموعة على أساس ترتيب العناصر داخل هذه المجموعة المتطابقة. على سبيل المثال، ...
المحددات في jQuery
توفر مكتبة jQuery مجموعة قوية من الأدوات لمطابقة العناصر وتحديدها في الصفحة، إذ استفادت المكتبة من CSS بجميع إصداراتها. من أجل استعمال المحارف الخاصة (مثل !"#$%&'()*+,./:;<=>?@[\]^`{|}~) كجزء صرف من الاسم المراد تحديده، يجب أن تهرب تلك المحارف عبر \\. على سبيل المثال، إن كان اسم العنصر المراد تحديده هو id="foo.bar"، يمكنك تحديده عبر المُحدِّد $("#foo\\.bar"). تحوي مواصفات CSS القياسية (أي W3C CSS specification) مجموعة كاملة من القواعد المتعلقة بالمحددات الصالحة. هنالك أيضًا مقالة مفيدة لصاحبها Mathias Bynens تتحدث عن تهريب ...
التابع .data() في jQuery
يخزِّن التابع .data() بيانات عشوائية مرتبطة بالعناصر المتطابقة أو تُعيد القيمة في مخزن البيانات المحدد للعنصر الأول في مجموعة العناصر المتطابقة. .data( key, value ) القيمة المعادة يعيد التابع .data() كائنًا من النوع jQuery. الوصف يُخزن بيانات عشوائية مرتبطة بالعناصر المتطابقة. .data( key, value ) أُضيفت مع الإصدار: 1.2.3. key سلسلة نصية مُنشَأة من الكائن String تشير إلى جزء من البيانات المراد تعيينه. value قيمة البيانات الجديدة، ويمكن أن تكون من أي نوع من أنواع JavaScript ما عدا القيمة undefined. ...
العناصر -
تُمثِّل عناصر <h1>-<h6> ستة مستويات من ترويسات الأقسام، ويكون العنصر <h1> أعلى مستوى والعنصر <h6> أدنى مستوى. المثال الآتي يعرض جميع مستويات الترويسات: <h1>العنوان من المستوى 1</h1>
<h2>العنوان من المستوى 2</h2>
<h3>العنوان من المستوى 3</h3>
<h4>العنوان من المستوى 4</h4>
<h5>العنوان من المستوى 5</h5>
<h6>العنوان من المستوى 6</h6>
أما المثال الآتي فيبيّن استعمال عدد من مستويات الترويسات مع بعض المحتوى بعدها: <h1>العناوين</h1>
<h2>الخلاصة</h2>
<p>بعض النص الذي يلخص العناوين</p>
<h2>أمثلة</h2>
<h3>المثال الأول</h3>
<p>نص المثال الأول</p>
<h3>المثال الثاني</h3>
<p>نص المثال الثاني</p>
<h2>مصادر</h2>
<p>موسوعة حسوب</p>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي. المحتوى المسموح المحتوى الفعلي (phrasing content). الوسم المختصر ...
التابع .insertBefore() في jQuery
.insertBefore( target ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف إدخال كل عنصر من مجموعة العناصر المُطابقة بعد الهدف. .insertBefore( target ) أُضيف مع الإصدار: 1.0. target كائن قد يكون من النوع Selector أو htmlString أو Element أو Array أو jQuery، وهو يمثل محدد أو عنصر أو مصفوفة عناصر أو سلسلة HTML أو كائن jQuery؛ ستدرج مجموعة العناصر المطابقة قبل العنصر (العناصر) المحدد بواسطة هذا المعامل. يُنفذ التابع .before() والتابع .insertBefore() نفس المهمة. الاختلاف الرئيسي هو في بناء الجملة، على ...
التابع .keydown() في jQuery
.keydown( handler ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يربط هذا التابع معالج حدث معين مع الحدث keydown (الضغط على مفتاح في لوحة المفاتيح) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر. .keydown( handler ) أُضيف مع الإصدار: 1.0. handler دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث. .keydown( [eventData ], handler ) أُضيف مع الإصدار: 1.4.3. eventData أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى ...
التابع .removeClass() في jQuery
.removeClass( [className ] ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يحذف هذا التابع صنفًا واحدًا، أو عدَّة أصناف، أو جميع الأصناف من كل عنصر في مجموعة العناصر المطابقة. .removeClass( [className ] ) أُضيف مع الإصدار: 1.0. className سلسلة نصيَّة تمثِّل اسم صنفٍ واحدٍ أو عدَّة أصناف مفصولة بمسافة يراد حذفها من الخاصِّيَّة class لكل عنصر مطابق. .removeClass( function ) أُضيف مع الإصدار: 1.4. function دالة من الشكل Function( Integer index, String className ) والتي تعيد سلسلة نصية تمثِّل ...
التابع .insertAfter() في jQuery
.insertAfter( target ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف إدخال كل عنصر من مجموعة العناصر المُطابقة بعد الهدف. .insertAfter( target ) أُضيف مع الإصدار: 1.0. target كائن قد يكون من النوع Selector أو htmlString أو Element أو Array أو jQuery، وهو يمثل محدد أو عنصر أو مصفوفة عناصر أو سلسلة HTML أو كائن jQuery؛ ستدرج مجموعة العناصر المطابقة بعد العنصر (العناصر) المحدد بواسطة هذا المعامل. ينفذ كلٌ من التابع .after() والتابع .insertAfter() نفس المهمة. الاختلاف الرئيسي هو في ...
التابع .fadeTo() في jQuery
.fadeTo( duration, opacity [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يضبط هذا التابع درجة عتامة العناصر المطابقة. .fadeTo( duration, opacity [, complete ] ) أُضيف مع الإصدار: 1.0. duration مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. opacity رقم من النوع Number يتراوح ما بين 0 و 1 ويشير إلى درجة العتامة المستهدفة. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة. .fadeTo( duration, opacity [, easing ] [, complete ] ) ...
التابع .addClass() في jQuery
.addClass( className ) القيمة المعادة كائن jQuery. الوصف يُستخدَم التّابع .addClass() لإضافة الصّنف أو الأصناف المُحدَّدة لكل عنصر من مجموعة العناصر المُطابقة. .addClass( className ) أضيفت في الإصدار: 1.0. className سلسلة نصيّة من الكائن String، وتُمثِّل صنف أو عدة أصناف مفصولة بمسافة بينها لإضافتها إلى الخاصيّة class لكل عنصر مُطابق. .addClass( function ) أضيفت في الإصدار: 1.4. Function دالة على الشكل Function( Integer index, String currentClassName ) وتُعيد سلسلة نصيّة. دالة تُعيد اسم أو عدة أسماء لأصناف مفصولةً بمسافة بينها ...
Document
تُمثّل الواجهة Document أي صفحة ويب مُحمّلة في المُتصفح وتعمل كنُقطة بداية للوصول إلى مُحتوى الصّفحة، أي شجرة DOM التي تشمل عناصر مثل <body> و <table>، إضافة إلى العديد من العناصر الأخرى. وتُوفِّر إمكانيّة التّعامل بشكل عمومي للمُستند، مثل كيفيّة الحصول على عنوان URL الخاصّ بالصّفحة وكيفيّة إنشاء عناصر جديدة في المُستند. تصِفُ الواجهة Document الخصائص (properties) والتّوابع (methods) الشّائعة لأي نوع كان من المُستندات. واعتمادًا على نوع المُستند (مثل HTML، و XML، و SVG وغيرها)، يُمكن أن تتوفّر واجهة ...
التابع jQuery.noConflict() في jQuery
jQuery.noConflict( [removeAll ] ) القيم المعادة يعيد كائنًا من النوع Object. الوصف يجبر هذا التابع jQuery على التنازل عن التحكم بالمتغيِّر $. jQuery.noConflict( [removeAll ] ) أُضيف مع الإصدار: 1.0. removeAll قيمةٌ منطقيَّةٌ تحدِّد إن كان يراد إزالة جميع متغيرات jQuery من النطاق العام (global scope) بما فيها jQuery نفسها. تستعمل أغلب مكتبات JavaScript المعامل $ بوصفه دالةً أو اسم متغيِّر مثلما تفعل jQuery تمامًا. ففي حالة مكتبة jQuery، يُعدُّ $ اسمًا بديلًا للعبارة jQuery، لذا تكون جميع الوظائف متاحة ...
العنصر
يُستخدَم العنصر <track> داخل العنصر <audio> أو <video> ويسمح لك باستخدام مسارات نصية مؤقتة مثل الترجمات المصاحبة لمقاطع الفيديو. تكون هذه المقاطع بصيغة WebVTT (وملفاتها بامتداد .vtt أي Web Video Text Tracks). مثال عن استخدام العنصر <video> لإضافة مقطع فيديو بصيغة OGG و MP4 (عبر العنصر <source>) وله صورة غلاف تُعرَض إلى أن يبدأ تشغيله (الخاصية poster)، وفيه عناصر <track> تمثل captions، وعناوين الفصول، وترجمات للألمانية والإنكليزية واليابانية والعربية، مع بعض البيانات الوصفية: <video controls poster="/images/sample.gif">
<source src="sample.mp4" ...
التابع .keyup() في jQuery
.keyup( handler ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يربط هذا التابع معالج حدث معين مع الحدث keyup (الضغط على مفتاح في لوحة المفاتيح) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر. .keyup( handler ) أُضيف مع الإصدار: 1.0. handler دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث. .keyup( [eventData ], handler ) أُضيف مع الإصدار: 1.4.3. eventData أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى ...
التابع jQuery.noConflict() في jQuery
jQuery.noConflict( [removeAll ] ) القيم المعادة يعيد كائنًا من النوع Object. الوصف يجبر هذا التابع jQuery على التنازل عن التحكم بالمتغيِّر $. jQuery.noConflict( [removeAll ] ) أُضيف مع الإصدار: 1.0. removeAll قيمةٌ منطقيَّةٌ تحدِّد إن كان يراد إزالة جميع متغيرات jQuery من النطاق العام (global scope) بما فيها jQuery نفسها. تستعمل أغلب مكتبات JavaScript المعامل $ بوصفه دالةً أو اسم متغيِّر مثلما تفعل jQuery تمامًا. ففي حالة مكتبة jQuery، يُعدُّ $ اسمًا بديلًا للعبارة jQuery، لذا تكون جميع الوظائف متاحة ...
العنصر
يُعرِّف العنصر <thead> مجموعةً من الأسطر التي تُمثِّل ترويسةً لأعمدة العنصر <table>. مثال عن جدول فيه ثلاثة أقسام: ترويسة (عبر العنصر <thead>)، وجسم (عبر العنصر <tbody>)، وتذييل (عبر العنصر <tfoot>): <table>
<thead>
<tr>
<th>الترويسة 1</th>
<th>الترويسة 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>خلية عادية 1</td>
<td>خلية عادية 2</td>
...
العنصر
يُعرِّف العنصر <tfoot> مجموعةً من الأسطر التي تُمثِّل خلاصةً لأعمدة العنصر <table>. مثال عن جدول فيه ثلاثة أقسام: ترويسة (عبر العنصر <thead>)، وجسم (عبر العنصر <tbody>)، وتذييل (عبر العنصر <tfoot>): <table>
<thead>
<tr>
<th>الترويسة 1</th>
<th>الترويسة 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>خلية عادية 1</td>
<td>خلية عادية 2</td>
...
العنصر
يُمثِّل العنصر <ul> قائمةً غير مرتبة من العناصر، التي تُعرَض على شكل قائمة منقطة عادةً. قائمة غير مرتبة <ul> فيها ثلاثة عناصر <li>: <ul>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ul>
بطاقة العنصر تصنيفات المحتوى محتوى تنظيمي. المحتوى المسموح عنصر <li> واحد أو أكثر، ويمكن لهذا العنصر أن يحتوي أيضًا على قوائم <ol> أو <ul> متشعبة داخله. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLUListElement ...
خيارات المترجم في TypeScript
يوضح الجدول التالي جميع الخيارات التي يمكن استعمالها مع مترجم TypeScript للتحكم بسير عمله والتعديل على سلوكه أثناء ترجمة الشيفرات. الخيار النوع القيمة الافتراضية الوصف --allowJs boolean false السماح بترجمة ملفّات JavaScript. --allowSyntheticDefaultImports boolean module === "system" أو أنّ الخيار --esModuleInterop مضبوط وقيمة module ليست es2015 أو esnext السماح للاستيرادات الافتراضية من الوحدات التي لا تحتوي على تصديرات افتراضيّة. هذا لا يؤثر على الشيفرة المولَّدة، ويؤثر فقط على آلية التحقق من الأنواع. --allowUnreachableCode boolean false لا تُخبِر عن الأخطاء ...
العنصر
يُمثِّل العنصر <dl> قائمة وصف (description list)، وهذا العنصر يتضمن مجموعةً من المصطلحات وشرحها. يستخدم هذا العنصر عادةً في القواميس أو شرح المصطلحات، أو لعرض البيانات الوصفية (قائمة من أزواج «مفاتيح-قيم»). بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح مجموعة أو أكثر من عناصر <dt> متبوعة بعنصر <dd> واحد أو أكثر؛ ويُسمَح باستخدام العنصر <div> فيه. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLDListElement دعم المتصفحات Chrome ...
String.fromCodePoint()
الدالة String.fromCodePoint() الساكنة (static) تُعيد سلسلةً نصيةً مُنشَأةً باستخدام سلسلة من قيم المحارف (code points). البنية العامة String.fromCodePoint(num1[, ...[, numN]])
num1, ..., numN سلسلة من الأرقام التي تُمثِّل قيم المحارف (code points). القيمة المعادة سلسلة نصية تحتوي على محارف ترتبط بقيم المحارف المُمرَّرة إلى الدالة. الاستثناءات سيرمى الاستثناء RangeError إذا مُرِّرَ قيمة محرف يونيكود غير صالحة (مثلًا: "RangeError: NaN is not a valid code point"). الوصف هذه الدالة تُعيد سلسلةً نصيةً أوليّةً ولا تُعيد كائن String. لمّا كانت الدالة fromCodePoint هي دالةٌ ...
التابع .delegate() في jQuery
.delegate( selector, eventType, handler ) أُهمِل مع الإصدار: 3.0. القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يُرفق هذا التابع معالج بأحد الأحداث أو أكثر لكافة العناصر التي تطابق المُحدِد، الآن أو في المستقبل، استنادًا إلى مجموعة محددة من العناصر الجذر. .delegate( selector, eventType, handler ) أُضيف مع الإصدار: 1.4.2. selector سلسلة نصية تُحدد ترشيح العناصر التي تبدأ الحدث من النوع String. eventType سلسلة نصية تحتوي على واحد أو أكثر من أنواع أحداث JavaScript مفصولة بمسافات، مثل "click"، أو "keydown,"، ...
التابع .mousemove() في jQuery
.mousemove( handler ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يربط هذا التابع معالج حدث معين مع الحدث mousemove (التحرك داخل العنصر) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر. .mousemove( handler ) أُضيف مع الإصدار: 1.0. handler دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث. .mousemove( [eventData ], handler ) أُضيف مع الإصدار: 1.4.3. eventData أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى إمكانيَّة استخدام أي ...
الكلمة المحجوزة this في JavaScript
الكلمة المحجوزة this لها سلوكٌ في JavaScript يختلف عن بقية لغات البرمجة، وهنالك اختلافاتٌ في سلوكها بين النمط strict و non-strict. في أغلبية الحالات، تُحدَّد قيمة الكلمة المحجوزة this وفق طريقة استدعاء الدالة، إذ لا يمكن ضبط قيمتها باستخدام عملية الإسناد العادية أثناء التنفيذ؛ وقد تختلف قيمة this في كل مرة تُستدعى فيها الدالة. أضافت ES5 الدالة bind التي تضبط قيمة this داخل الدالة بغض النظر عن طريقة استدعائها، وأضافت ES2015 الدوال السهمية (arrow functions) التي تُوفِّر ربطًا خاصًا بها ...
التابع .keypress() في jQuery
.keypress( handler ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يربط هذا التابع معالج حدث معين مع الحدث keypress (الضغط على مفتاح في لوحة المفاتيح) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر. .keypress( handler ) أُضيف مع الإصدار: 1.0. handler دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث. .keypress( [eventData ], handler ) أُضيف مع الإصدار: 1.4.3. eventData أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى ...
الحقل button
عناصر <input> ذات النوع button تُعرَض كأزرار عادية، والتي يمكن برمجتها للتحكم بأي شيء في الصفحة عبر ربط دالة معالجة أحداث معها (التي تُعالِج الحدث click عادةً). وعلى الرغم من أنَّ عناصر <input> ذات النوع button صحيحة تمامًا في HTML، لكن من المفضّل استخدام عنصر <button> الجديد لإنشاء الأزرار، لأن له ميزات إضافية، مثل دعمه للقيمة menu في الخاصية type التي تعني أنَّ الزر يستعمل لتفعيل قائمة منبثقة، والسماح بإضافة نص اللافتة للعنصر <button> بين وسم البداية ووسم النهاية مما ...
العنصر
يُجمِّع العنصر <tbody> عنصر <tr> أو أكثر كجسم للعنصر <table>. مثال عن جدول فيه جسم (العنصر <tbody>)، الذي يحتوي على سطرين (العنصر <tr>) وأربع خلايا (العنصر <td>): <table>
<tbody>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في ...
العنصر
يُمثِّل العنصر <meter> إما قيمةً عددية ضمن مجال معيّن، أو قيمةً جزئية (fractional value). مثال بسيط عن استخدام العنصر <meter> لعرض درجة الحرارة التي يجب ضبط الفرن عليها لطهي نوع معيّن من الطعام، لاحظ استخدام الخاصية min لتحديد أدنى قيمة (أقل درجة حرارة متاحة في الفرن) والخاصية max لتحديد أكبر قيمة (أكبر درجة حرارة يمكن تسخين الفرن إليها) والخاصية value لتحديد درجة الحرارة المطلوبة: <p>سخِّن الفرن إلى
<meter min="200" max="500" value="350">350 درجة مئوية</meter>.</p>
مثال عن استخدام العنصر <meter> لتمثيل درجة ...
العنصر
يُحدِّد العنصر <source> عدِّة مصادر لملفات الوسائط المتعددة ضمن العنصر <picture> أو <audio> أو <video>. وهذا العنصر فارغ، وأكثر استخدام شائع له هو توفير محتوى الوسائط المتعددة نفسه لكن بصيغ مختلفة لكي يستطيع المتصفح تشغيل أنسبها. يشرح هذا المثال كيفية توفير مقطع فيديو بصيغة webm لمن يدعم متصفحه فيديو WebM، وتوفير المقطع بصيغة MP4 للمستخدمين الذين يدعم متصفحهم هذه الصيغة. إن لم يكن العنصر <audio> أو <video> مدعومًا من المتصفح فستظهر رسالة تنبه المستخدم إلى ذلك؛ وإن لم يكن المتصفح ...
حالة المكونات في React
ماذا يفعل التابع setState؟ يُجدوِل التابع setState() تحديثًا لكائن حالة المكوّن state. عندما تتغير الحالة يستجب المكوّن بإعادة التصيير. ما الفرق بين الحالة state والخاصيّات props؟ الخاصيّات props (اختصارًا للكلمة properties) والحالة state كلاهما عبارة عن كائنات JavaScript مجرّدة. وفي حين أنّ كلاهما يحمل معلومات تؤثر في ناتج التصيير، فهما مختلفان بطريقة واحدة هامة، حيث تُمرَّر الخاصيّات إلى المكوّن (بشكل مماثل لمُعاملات الدالة) بينما تُدار الحالة state ضمن المكوّن (بشكل مشابه للمتغيرات المعرفة بداخل الدالة). هنا تجد مصادر جيدة لقراءة ...
الخاصيات العامة
الخاصيات العامة هي الخاصية التي يمكن استعمالها في جميع عناصر HTML، على الرغم من أنَّها قد لا يكون لها تأثير إن استعملت على بعض العناصر. يمكن أن تستعمل الخاصيات العامة على جميع عناصر HTML حتى لو لم تكن هذه العناصر موجودةً في المعيار، وهذا يعني أنَّ العناصر غير المعيارية يجب أن تسمح باستخدام هذه الخاصية، حتى لو كان استخدام هذه العناصر سيؤدي إلى جعل المستند غير متوافق مع معيار HTML5. فمثلًا ستخفي المتصفحات التي تدعم HTML5 المحتوى الموجود ضمن العنصر ...
العنصر
يُمثِّل العنصر <ol> قائمةً مرتبةً من العناصر، التي تُعرَض على شكل قائمة مرقمة. مثال عن قائمة مرتبة <ol> فيها ثلاثة عناصر <li>: <ol>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ol>
بطاقة العنصر تصنيفات المحتوى محتوى تنظيمي. المحتوى المسموح عنصر <li> واحد أو أكثر، ويمكن لهذا العنصر أن يحتوي أيضًا على قوائم <ol> أو <ul> متشعبة داخله. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLOListElement دعم ...
العنصر
يُعرِّف العنصر <colgroup> مجموعة أعمدة ضمن أحد الجداول. لمشاهدة مثال عن استخدام العنصر <colgroup>، راجع صفحة العنصر <table> والعنصر <col>. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح إذا كانت الخاصية span مستخدمة، فلا يوجد فهو عنصرٌ فارغ. أما إذا لم تكن الخاصية موجودةً، فالعنصر <col> صفر مرة أو أكثر. الوسم المختصر يمكن حذف وسم البداية إذا كان أوّل أبناء هذا العنصر هو عنصر <col> ولم يُسبَق هذا العنصر بعنصر <colgroup> حُذِفَ وسم إغلاقه. يمكن حذف وسم الإغلاق إذا لم يُتبَع هذا ...
العنصر
يُعرِّف العنصر <col> عمودًا ضمن أحد الجداول، ويُستخدم لإعطاء هيكل تنظيمي للخلايا المتشابهة، ويكون موجودًا داخل عنصر <colgroup>. مثال عن جدول فيه مجموعة من الأعمدة (العنصر <colgroup>) وعرّفنا داخله عمودًا (العنصر <col>) لون خلفيته أخضر: <table>
<colgroup>
<col style="background-color: #0f0">
</colgroup>
<tr>
<th>التفاح</th>
<th>الليمون</th>
<th>البرتقال</th>
</tr>
<tr>
<td>أخضر</td>
<td>أصفر</td>
<td>برتقالي</td>
</tr>
</table>
بطاقة العنصر تصنيفات المحتوى ...
العنصر
يُعرِّف العنصر <tr> سطرًا يحتوي على خلايا في جدول، وهذه الخلايا تُمثَّل عبر العنصرين <td> و <th>. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. ...
Document.evaluate()
يُنشئ التّابع Document.evaluate() كائنًا من النّوع XPathResult مبني على تعبير XPath ومعاملات معطاة أخرى. البنية العامة var xpathResult = document.evaluate(
xpathExpression,
contextNode,
namespaceResolver,
resultType,
result
);
xpathExpression سلسة نصيّة تُمثّل تعبير XPath المرغوب تقديره (evaluate). contextNode يُحدّد عقدة السّياق للاستعلام (انظر مواصفة XPath). من الشّائع تمرير كائن المستند document كعقدة سياق. namespaceResolver دالّة تُمرَّر لها سابقات مجالات الأسماء (namespace prefixes) لتُعيد سلسلةً نصيّة تُمثّل عنوان URI مجال الأسماء المرتبط بالسّابقة المُمرَّرة. ستُستعمل لحلّ السّابقات داخل تعبير XPath ...
العنصر
يُعرِّف العنصر <area> منطقةً في خريطة لصورة، ويمكن أن ترتبط تلك المنطقة (اختياريًا) مع رابط فائق. لا يمكن استخدام هذا العنصر إلا ضمن عنصر <map>. لمشاهدة مثال متكامل عن استخدام العنصر <area>، راجع صفحة العنصر <map>. بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي. المحتوى المسموح لا يوجد، فهو عنصرٌ فارغ. الوسم المختصر يجب أن يكون وسم البداية موجودًا، ويجب أن يُحذَف وسم النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي؛ لكن يجب أن يكون العنصر <area> متواجدًا ضمن ...
التابع .fadeToggle() في jQuery
.fadeToggle( [duration ] [, easing ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة أو يخفيها عن طريق تحريك درجة العتامة. .fadeToggle( [duration ] [, easing ] [, complete ] ) أُضيف مع الإصدار: 1.4.4. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. easing (القيمة الافتراضية: swing) سلسلة نصية من النوع String، تُشير إلى دالة التخفيف المستخدمة في عملية التحوّل. complete دالة على الشكل ...
العنصر
يُستعمَل العنصر <audio> لتضمين المحتوى الصوتي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب الملفات الصوتية لتشغيلها. المثال الآتي يستخدم العنصر <audio> مع الخاصية autoplay لتشغيل الصوت تلقائيًا مع تحديد رابط URL للملف المصدري عبر الخاصية src: <audio src="khamsat.mp3" autoplay>
لا يدعم متصفحك العنصر <code>audio</code>.
</audio>
أما المثال الآتي ففيه العنصر <audio> مع استخدام خاصية controls لإضافة أزرار للتحكم بالمقطع، وسيُحدَّد رابط URL للمقطع عبر العنصر <source>: ...
التابع .fadeIn() في jQuery
.fadeIn( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة عن طريق تحويلها إلى الإعتام (opaque، أي لن تصبح شفافةً) تدريجيًا. .fadeIn( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .fadeIn( options ) أُضيف مع الإصدار: 1.0. options ...
العنصر
يُعرِّف العنصر <th> خليةً تُمثِّل ترويسةً في الجدول الذي يحتويها. تُعرّف طبيعة هذه الترويسة عبر الخاصيتين scope و headers. مثال عن استخدام الخاصية scope لتحديد ما هي الخلايا التي تُمثِّلها ترويسة ما: <table>
<caption>معلومات التواصل</caption>
<tbody>
<tr>
<th scope="col">الاسم</th>
<th scope="col">رقم الهاتف</th>
<th scope="col">المدينة</th>
</tr>
<tr>
<th scope="row">الموظف 1</th>
...
تعليمات الشرطات المائلة الثلاث في TypeScript
مقدمة تعليمات الشرطات المائلة الثلاث (Triple-slash directives) هي تعليقات تكتب في سطر واحد تحتوي على وسم XML واحد. تُستخدَم محتويات التعليق كتعليمات (إرشادات) للمترجم. تكون تعليمات الشرطات المائلة الثلاث صالحةً فقط في أعلى الملفّ الذي تكون هذه التعليمات موجودة داخله. ويُمكن لهذه التعليمات أن تُسبَق فقط بتعليق في سطر واحد أو تعليق متعدّد الأسطر (multi-line comment)، ما يشمل تعليمات شرطات مائلة ثلاث أخرى. إذا وُجِدَت بعد جملة أو تصريح فستُعامَل على أنها تعليقات عادية في سطر واحد (regular single-line comments)، ...
العنصر
يُعرِّف العنصر <td> خليةً في الجدول الذي يحتويها. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح المحتوى التنظيمي. الوسم المختصر لا ...
العنصر
يُحدِّد العنصر <link> العلاقات بين المستند الحالي وبين مورد خارجي (external resource)؛ من استخدامات هذا الوسم تتضمن تعريف علاقة بين الصفحات للتنقل بينها، بيد أنَّ أكثر استخدامات هذا العنصر شيوعًا هو تضمين صفحات الأنماط. استخدام الشكل الآتي للعنصر <link> لتضمين صفحة أنماط في المستند: <link href="style.css" rel="stylesheet">
بطاقة العنصر تصنيفات المحتوى البيانات الوصفية المحتوى المسموح لا يوجد، فهذا العنصر فارغ. الوسم المختصر لمّا كان هذا العنصر فارغًا، فيجب توفير وسم البداية وحذف وسم النهاية. العناصر الأب أي عنصر يقبل وجود ...
العنصر
يُمثِّل العنصر <button> زرًا قابلًا للضغط. مثال عن استخدام العنصر <button>: <button name="button">اضغط هنا</button>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي وعنصر عادي، وعنصر تفاعلي ... المحتوى المسموح المحتوى العادي. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي. واجهة DOM HTMLButtonElement دعم المتصفحات Chrome Firefox Edge Safari Opera مدعوم مدعوم مدعوم مدعوم مدعوم الخاصيات يمكن استخدام الخاصيات العامة في هذا العنصر. autofoucs تسمح لنا هذه الخاصية المنطقية (Boolean) بتحدد أنَّنا نريد ...
العنصر
يُمثِّل العنصر <form> قسمًا في المستند الذي يحتوي على عناصر يستطيع المستخدم التفاعل معها لإرسال بيانات إلى خادوم الويب. مثال بسيط عن نموذج يُرسَل عبر الطريقة GET: <form action="" method="get">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال بسيط عن نموذج يُرسَل عبر الطريقة POST: <form action="" method="post">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال عن نموذج يبيّن استخدام العناصر <fieldset> و <legend> و <label>: <form action="" method="post">
<fieldset>
...
العنصر
يُستعمَل العنصر <video> لتضمين المحتوى المرئي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب صيغة لتشغيلها. مثال عن استخدام العنصر <video> لإضافة مقطع فيديو بصيغة WebM (عبر الخاصية src) بارتفاع 360، مع عرض عناصر التحكم (عبر الخاصية controls) وله صورة غلاف تُعرَض إلى أن يبدأ تشغيله (الخاصية poster)، وستُعرَض رسالة نصية تنوِّه المستخدم أنَّ متصفحه لا يدعم العنصر <video>: <video src="khamsat.webm" controls poster="khamsat-poster.jpg" height="360">
لا ...
التابع .slideDown() في jQuery
()slideDown. القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يُظهِر هذا التابع جميع العناصر المتطابقة مع حركة انسحابيَّة. .slideDown( [duration ] [, complete ] ) أضيف مع الإصدار 1.0. duration عدد أو سلسلة نصية تمثِّل كمية الوقت الذي ستستغرقه عملية تحريك العنصر، وقيمته الافتراضيَّة هي 400. complete دالةٌ من الشكل Function() وتُستدعَى مرةً وحدةً مع كل عنصر من العناصر المطابقة بعد اكتمال الحركة المطبَّقة عليه. .slideDown( options ) أضيف مع الإصدار: 1.0. Options كائن من النوع Object، وهو مجموعة من ...
التابع .toggle() في jQuery
.toggle( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يبدِّل هذا التابع حالة العناصر المُطابقة بين العرض و الإخفاء. .toggle( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .toggle( options ) أُضيف مع الإصدار: 1.0. options كائن من النوع Object، ويقدم مجموعة من ...
Document.getElementsByClassName()
يُعيد التّابع Document.getElementsByClassName() كائنًا مُشابهًا للمصفوفات يحتوي على جميع العناصر الأولاد التي تحمل نفس اسم الصّنف (class name) المُعطى. عند استدعائه على كائن المُستند، فسيُبحَثُ في كامل المُستند، ما يشمل العقدة الجذر. يُمكن كذلك استدعاء التّابع getElementsByClassName() على أي عنصر؛ وسيُعيد العناصر الأولاد للعنصر الجذر المُحدَّد ذات أسماء الأصناف المعطاة. البنية العامة var elements = document.getElementsByClassName(names);
// أو
var elements = rootElement.getElementsByClassName(names);
elements كائنٌ حيّ من النّوع HTMLCollection الذي يُمثّل مجموعة العناصِر التي وُجدت. names سلسلةٌ نصيّةٌ تُمثّل قائمة أسماء الأصناف المرغوب ...
Document.queryCommandSupported()
يشير التّابع Document.queryCommandSupported() إلى ما إذا كان أمر التّحرير المعطى مدعومًا من طرف المتصفّح أم لا. البنية العامة isSupported = document.queryCommandSupported(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أم لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مدعومًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandSupported("SelectAll");
if(flg) {
// نفّذ عمليّةً ما
}
ملاحظات يعيد الأمر 'paste' القيمة false في حالة لم يكن الأمر متاحًا إضافةً إلى حالة كون السكربت المستدعي ...
Document.fullscreenElement
تُعيد الخاصية Document.fullscreenElement القابلة للقراءة فقط العنصر Element الذي في وضع ملء الشاشة حاليًا ضمن عناصر المستند الحالي، أو تُعيد القيمة null في حالة لم يكن وضع ملء الشاشة مُفعلًا. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var element = document.fullscreenElement;
ستكون قيمة المتغيّر element هي إشارةٌ إلى العنصر الموجود في وضع ملء الشاشة حاليًا، أو القيمة null في حالة ...
Document.createCDATASection()
يُنشئُ التّابع Document.createCDATASection() عقدةَ قسم CDATA جديدةً ويُعيدها. البنية العامة CDATASectionNode = document.createCDATASection(data)
CDATASectionNode يُمثّل عقدةً من النّوع CDATASection. data سلسلةٌ نصيّة تحتوي على البيانات المرغوب إضافتها إلى قسم CDATA. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml")
var cdata = docu.createCDATASection('هنا عقدة البيانات');
docu.getElementsByTagName('xml')[0].appendChild(cdata);
alert(new XMLSerializer().serializeToString(docu));
// ستَعرضُ
// <xml><![CDATA[هنا عقدة البيانات]]></xml>
ملاحظات يعمل هذا مع مستندات XML فقط، ولا يعمل مع مستندات HTML (لأنّ مُستندات HTML لا تدعم أقسام CDATA)؛ مُحاولة استعمال التّابع مع مُستندات HTML سترمي الاستثناء NOT_SUPPORTED_ERR. سترمي كذلك الاستثناء NS_ERROR_DOM_INVALID_CHARACTER_ERR ...
Document.createExpression()
يُجمّع التّابع Document.createExpression() استعلام XPathExpression، والذي يُمكن استعماله بعد ذلك لإجراء تقديرات (evaluations) يُمكن تكرارها. البنية العامة xpathExpr = document.createExpression(xpathText, namespaceURLMapper);
xpathText سلسلة نصيّة تُمثّل تعبير XPath المرغوب تجميعه. namespaceURLMapper دالّة تربط سابقة مجال أسماءٍ (namespace prefix) برابط URL مجال أسماءٍ أو القيمة null إن لم يكن ذلك مطلوبًا. القيمة المعادة كائنٌ من النّوع XPathExpression.
Document.onfullscreenchange
الخاصيّة Document.onfullscreenchange مُعالِج أحداثٍ للحدث fullscreenchange الذي يُطلَق عندما يلِج أو يخرج مُستندٌ من وضع ملء الشّاشة. البنية العامة targetDocument.onfullscreenchange = fullscreenChangeHandler;
مثال document.onfullscreenchange = function ( event ) {
console.log("هناك تغيّر في وضع ملء الشّاشة")
};
document.documentElement.onclick = function () {
// يجب استدعاء التّابع
// requestFullscreen()
// داخل مُعالج أحداث لكي لا يفشَل استدعاؤه
document.documentElement.requestFullscreen();
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي 45 47 وراء full-screen-api.unprefix.enabled ؟ ؟ ؟ ...
Document.location
تُعيد الخاصيّة Document.location القابلة للقِراءة فقط كائنًا من النّوع Location، والذي يحتوي على معلومات حول عنوان URL الخاصّ بالمُستند ويُتيح توابع لتعديل عنوان URL هذا وتحميل عنوان URL آخر. ورغم أنّ الخاصيّة Document.location للقِراءة فقط، إلا أنّك تستطيع تعيين سلسلة نصيّة من النّوع DOMString لها كذلك. ما يعني بأنّك تستطيع التّعامل مع هذه الخاصيّة بصفتها سلسلة نصيّة عاديّة في مُعظم الحالات. والسّطران التّاليّان مُتكافئان: document.location = 'http://www.example.com'
document.location.href = 'http://www.example.com'
للحصول على عنوان URL المُستندِ وحده، يُمكنك استعمال الخاصيّة document.URL كذلك. ...
Document.createComment()
يُنشئُ التّابع Document.createComment() عقدةَ تعليق جديدةً ويُعيدها. البنية العامة CommentNode = document.createComment(data)
data سلسلةٌ نصيّة تحتوي على التعليق المرغوب إضافته. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml");
var comment = docu.createComment('هذا تعليق');
docu.getElementsByTagName('xml')[0].appendChild(comment);
alert(new XMLSerializer().serializeToString(docu));
// تعرض
// <xml><!--هذا تعليق--></xml>
مصادر ومواصفات مواصفة createComment
Document.queryCommandEnabled()
يشير التّابع Document.queryCommandEnabled() إلى ما إذا كان أمر التّحرير المعطى مفعّلًا من طرف المتصفّح أم لا. البنية العامة isEnabled = document.queryCommandEnabled(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أو لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مُفعّلًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandEnabled("SelectAll");
if(flg) {
document.execCommand("SelectAll", false, null); // الأمر مُفعّل، لذا نفّذه
}
ملاحظات بالنّسبة للأمران 'cut' و'copy' فإنّ التّابع يعيد القيمة true فقط إن استدعيَ في ...
Document.fullscreenEnabled
تُعيد الخاصية Document.fullscreenEnabled القابلة للقراءة فقط كائنًا من النوع Boolean يُشير إلى ما إذا كان وضع ملء الشاشة مُتاحًا أم لا. وضع ملء الشاشة مُتاح للصفحات التي لا تحتوي على إضافات ذات نوافِذَ في أي من مُستنداتها فقط، وفي حالة كانت جميع عناصر <iframe> التي تحوي المُستند ذات خاصيّة allowfullscreen مضبوطة. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var isFullscreenAvailable ...
Document.dir
الخاصيّة Document.dir خاصيّةٌ من النّوع DOMString تُمثّل اتّجاهيّة النّص في المُستند، إمّا من اليسار إلى اليمين (وهو الخيار الافتراضي) أو من اليمين إلى اليسار. القيَم المُمكنة هي 'rtl' أي من اليمين إلى اليسار، والقيمة 'ltr' التّي تعني من اليسار إلى اليمين. البنية العامة dirStr = document.dir;
document.dir = dirStr;
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم ؟ ؟ مصادر ومواصفات مواصفة HTML Living Standard.
Document.defaultView
في المُتصفحات، تُعيد الخاصيّة Document.defaultView الكائن window المُرتبط بالمستند، أو القيمة null إن لم يكن متوافرًا. البنية العامة var win = document.defaultView;
الخاصيّة قابلة للقراءة فقط. دعم المتصفحات الميزة Chrome Edge Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard. مواصفة HTML5.
Document.exitPointerLock()
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. يُحرّر التّابع Document.exitPointerLock() قفل مؤشّر الفأرة بشكل غير مُتزامنٍ حسب طلبٍ سابقٍ من Element.requestPointerLock. للتحقّق من نجاح أو فشل الطّلب، لابدّ من الاستماع للحدثين pointerlockchange وpointerlockerror. البنية العامة document.exitPointerLock();
دعم المتصفحات الميزة Chrome Edge Firefox Internet Explorer Opera Safari الدعم الأساسي نعم (قد تحتاج إلى السّابقة -webkit في إصدارات قديمة) نعم نعم، مع السّابقة -moz 50 دون سابقة ؟ ؟ ؟ انظر أيضًا Document.pointerLockElement Element.requestPointerLock مصادر ومواصفات ...
Document.head
تُعيد الخاصية document.head العنصر <head> الخاصّ بالمُستند الحالي. إن كان للمُستند أكثر من عنصر <head> واحد، فالقيمة المُعادة ستُمثّل العنصر الأول. البنية العامة var objRef = document.head;
مثال // نضع ما يلي
// في ملفّ
// HTML
// <head id="my-document-head">
var aHead = document.head;
alert(aHead.id); // "my-document-head";
alert( document.head === document.querySelector("head") ); // true
ملاحظات الخاصيّة document.head للقِراءة فقط. مُحاولة ضبط قيمة لها سيفشَل دون أي أخطاء، أو سيرمي خطأ TypeError في مُتصفّح Firefox في حالة كان المستند في نمط strict. دعم المتصفحات الميزة Chrome Edge ...
Document.preferredStyleSheetSet
تُعيد مجموعة صفحات الأنماط المُفضّلة حسب ما ضبطه كاتب الصّفحة. وهي للقراءة فقط. البنية العامّة preferredStyleSheetSet = document.preferredStyleSheetSet
تُشير قيمة المتغيّر preferredStyleSheetSet إلى مجموعة صفحات الأنماط المُفضّلة من طرف كاتب الصّفحة. يُحدَّدُ هذا من خلال ترتيب تعريفات صفحات الأنماط وترويسة HTTP ذات العنوان Default-Style. إن لم تكن هناك مجموعة صفحات أنماط مُفضَّلة من طرف الكاتب، فستكون القيمة المُعادة سلسلةً نصية فارغة (""). مثال if (document.preferredStyleSheetSet) {
console.log("مجموعة صفحات الأنماط المُفضّلة هي:" + document.preferredStyleSheetSet);
} else {
console.log("لا توجد صفحة ...
Document.onselectionchange
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. الخاصيّة Document.onselectionchange مُعالِج أحداثٍ للحدث selectionchange الذي يُطلَق عندما يتغيّر تظليل الكائن. البنية العامة obj.onselectionchange = function;
المُتغيّر function هي دالّة عرّفها المُستخدم user-defined، دون اللاحقة () أو أية مُعاملات، أو تعريفٌ لدالّةٍ مجهولة (anonymous function). مثال document.onselectionchange = function() { console.log("لقد تغيّر التّظليل"); };
دعم المتصفحات الميزة Chrome Internet Explorer Edge Firefox Opera Safari الدعم الأساسي 49 ؟ نعم 45 ؟ ؟ انظر أيضًا selectionchange selectstart ...
Document.timeline
تنبيه: هذه تقنيّة تجريبيّة، انظر جدول دعم المُتصفحات قبل استعمال هذه الخاصيّة في شيفرة إنتاجيّة. تُعيد الخاصيّة القابلة للقراءة فقط timeline المُعرَّفة على الواجهة Document الخطَّ الزمني الافتراضي للمُستند الحالي. هذا الخط الزّمني كائن خاص من النوع DocumentTimeline الذي يُنشأ تلقائيا عند تحميل الصّفحة. الخطّ الزمني فريد لكل مستند ويبقى طيلة مُدّة بقاء المُستند حيًّا، ما يشمل استدعاءات التّابع document.open(). تُحسب القيم الزمنية لهذا الخط الزمني حسب حدّ ثابت (fixed offset) من السّاعة العموميّة بحيث يُكافئ وقتُ الصّفر (zero time) ...
Document.write()
يكتب التّابع Document.write() سلسلةً نصيّةً إلى مجرى (stream) مستندٍ فُتح بالتّابع window.open(). مُلاحظة: لأنّ التّابع Document.write() يكتب إلى مجرى المستند، فاستدعاؤه على مستندٍ مُغلقٍ (مُحمَّل) يستدعي تلقائيًّا التّابع Document.open()، الذي سيحذف محتويات المستند. البنية العامة document.write(markup);
markup سلسلة نصيّة تحتوي على النّص المرغوب كتابته على المستند. مثال <!DOCTYPE html>
<html>
<head>
<title>write مثال</title>
<script>
function newContent() {
alert("تحميل محتوى جديد");
document.open();
document.write("<h1>المحتوى ...
Document.visibilityState
تُعيد الخاصيّة Document.visibilityState القابلة للقراءة فقط حالةَ ظهور المُستند، أي سياق وضوح العنصر الحالي. إذ من المُفيد معرفة ما إذا كان المُستند في الخلفيّة أو في تبويب (لسان، tab) غير مرئي حاليًّا، أو أنّ الصّفحة قد حُمّلت فقط من أجل ما قبل التّصيير (pre-rendering). القيم المُمكنة هي كما يلي: 'visible': تُشير إلى أنّ مُحتويات الصّفحة قد تكون ظاهرة ولو جزئيّا. هذا يعني بأنّ الصفحة موجودة على تبويب أمامي في نافذة غيرِ مُصغّرة. 'hidden': مُحتويات الصّفحة غير واضحة للمستخدم. هذا يعني ...
Document.execCommand()
عندما ينتقل مستند HTML إلى نمط التّصميم designMode فإنّ كائن المستند يوفّر التّابع Document.execCommand() الذي يسمح للمستخدم بتنفيذ الأوامر للتعامل مع محتويات المنطقة القابلة للتّعديل. تؤثّر معظم هذه الأوامر على محتويات المستند الموجودة (تعديل النصوص لجعلها بخط عريض أو مائل مثلًا)، فيما تُدخِل بعض الأوامر الأخرى عناصر جديدة (مثل إضافة رابط) أو تؤثّر على كامل السّطر (مثل إزاحته). عند استخدام الخاصيّة contentEditable، فاستدعاء التّابع Document.execCommand() يؤثّر على العنصر المُفعّل القابل للتعديل حاليًّا. البنية العامة bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)
القيمة ...
Document.enableStyleSheetsForSet()
يفعّل التّابع Document.enableStyleSheetsForSet() صفحات الأنماط التي توافق الاسم المُحدّد في مجموعة صفحات الأنماط الحاليّة، ويُعطّل جميع صفحات الأنماط الأخرى (عَدا تلك التي بدون عنوان، والتي تكون دائمًا مُفعّلة). البنية العامة document.enableStyleSheetsForSet(name)
name اسم صفحات الأنماط المرغوب تفعيلها. ستُفعّل جميع صفحات الأنماط التي توافق هذا الاسم، لكن ستُعطَّل جميع صفحات الأنماط الأخرى التي تملك عنوانًا. مرّر سلسلةً نصيّةً فارغةً لهذا المُعامل لتعطيل جميع صفحات الأنماط البديلة والمُفضّلة (دون صفحات الأنماط الدّائمة التي لا تملك خاصّية title). ملاحظات تُوافَقُ العناوين يكون حسّاسًا ...
Document.hasFocus()
يُعيد التّابع Document.hasFocus() قيمة منطقيّة من النّوع Boolean تدلّ على ما إذا كان المستند أو أي عنصرٍ داخل المستند مُركَّزًا عليه أو لا. يُستعمل هذا التّابع لتحديد ما إذا كان العنصر المفعّل في مستند مُركَّزًا عليه أو لا. ملاحظة: عند عرض مستندٍ ما، فالعنصر المُركّز عليه هو دائمًا العنصر المفعّل في المستند، لكنّ العنصر المفعّل لا يكون دائمًا مُركَّزًا عليه بالضّرورة. على سبيل المثال، عنصر مُفعّل داخل نافذة منبثقة في الخلفيّة لا يكون مركّزًا عليه. البنية العامة focused = document.hasFocus();
...
Document.hidden
تُعيد الخاصيّة Document.hidden قيمة منطقيّة تُشير إلى ما إذا كانت الصّفحة مخفية أم لا. لاحظ أنّ هذه الخاصّية قابلة للقراءة فقط. البنية العامّة var boolean = document.hidden
مثال document.addEventListener("visibilitychange", function() {
console.log( document.hidden );
// افعل شيئا ما
});
دعم المتصفحات الميزة Chrome Firefox Internet Explorer Opera Safari الدعم الأساسي 13 مع السابقة -webkit- ، 33 دون سابقة. 18 10 12.10 7 مصادر ومواصفات مواصفة Page Visibility (Second Edition).
Document.querySelector()
يُعيد التّابع Document.querySelector() أول كائنٍ من النّوع Element الذي يُمثّل العنصر المُوافِق للمُحدِّد أو المحدّدات المعطاة. ويُعيد القيمة null في حالة لم يجِد أيّ عنصر. مُلاحظة: يتمّ البحث باستعمال المرور على العمق أولًا قبل التّرتيب (depth-first pre-order traversal) حول عقد المستند بدايةً من أول عنصر في هيكل المستند ويُكرّر (iterating) حول العقد في القائمة مرتّبةً حسب عدد العقد الأبناء. البنية العامة element = document.querySelector(selectors);
selectors سلسلة نصيّة من النّوع DOMString تحتوي على مُحدّد واحدٍ أو أكثر لمُوافقته مع عناصر المستند ...
Document.scripts
خاصيّة قابلة للقراءة فقط تُعيد جميع عناصر <script> في المُستند. والقيمة المُعادة كائنٌ من النّوع HTMLCollection. البنية العامة var scriptList = document.scripts;
القيمة المُعادة كائنٌ من النّوع HTMLCollection. يُمكنك التّعامل مع المُتغيّر scriptList كما تتعامل مع أي مصفوفة للوصول إلى جميع العناصر في القائمة. مثال المثال التّالي يتحقّق ممّا إذا كان للصّفحة الحاليّة أي عنصر <script>: var scripts = document.scripts;
if (scripts.length) {
alert("هذه الصّفحة تحتوي على سكربتات");
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم ...
Document.writeln()
يكتب التّابع Document.writeln() سلسلةً نصيّةً متبوعةً بمحرف سطرٍ جديدٍ (newline character) على المستند. البنية العامة document.writeln(line);
line سلسلة نصيّة تحتوي على سطر النّص المرغوب إضافته. مثال document.writeln("<p>أدخل كلمة المرور</p>");
ملاحظات التّابع Document.writeln() مشابه للتّابع Document.write() لكنّه يُضيف سطرًا جديدًا. كما هو الحال مع التّابع Document.write() فالتّابع Document.writeln() لا يعمل كذلك في مستندات XHTML، وستحصل على خطأ NS_ERROR_DOM_NOT_SUPPORTED_ERR يفيد بأنّ العمليّة غير مدعومة في سطر أوامر الأخطاء. يحدث هذا عن محاولة فتح ملفّ محليّ ذو الامتداد .xhtml أو أي مستندٍ مُقدَّمٍ ...
Document.plugins
تُعيد الخاصيّة Document.plugins مجموعةً من النّوع HTMLCollection تحتوي على قائمة بجميع عناصر <embed> الموجودة في المُستند الحاليّ. كلّ عنصر في المجموعة يُعدّ من النّوع HTMLEmbedElement، يُمكن أن يكون عدد العناصِر واحدًا أو أكثر، وفي حالة لم يوجَد أي عنصر، فستُعاد القيمة null. مُلاحظة: للحصول على قائمة بالإضافات (plugins) المُنصَّبة، استعمل الخاصيّة NavigatorPlugins.plugins. البنية العامة embedArrayObj = document.plugins
مصادر ومواصفات مواصفة HTML Living Standard
Document.embeds
تُعيد الخاصّية embeds قائمةً بالكائنات المُضمّنة داخل المُستند الحالي. البنية العامة nodeList = document.embeds
مصادر ومواصفات مواصفة HTML Living Standard.
Document.lastModified
تُعيد الخاصية document.lastModified سلسلةً نصيةً تحتوي على تاريخ ووقتِ آخر تعديلٍ للمُستند الحاليّ. البنية العامة string = document.lastModified;
مثال طريقة الاستعمال البسيطة: alert(document.lastModified);
// يُعيد تاريخا مُشابها لما يلي
// 03/22/2018 05:20:48
تحويل قيمة lastModified إلى كائن من النّوع Date: var oLastModif = new Date(document.lastModified);
تحويل قيمة lastModified إلى عدد الأجزاء من ألف جزء من الثّانيّة التّي مرّت منذ 1 يناير 1970 على السّاعة 00:00:00: var nLastModif = Date.parse(document.lastModified);
ملاحظات لاحظ بأنّه لا يُمكن استعمال السّلسة النّصيّة التي تُعيدها الخاصيّة lastModified ...
Document.selectedStyleSheetSet
تُعيد اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا. البنية العامة currentStyleSheetSet = document.selectedStyleSheetSet
document.selectedStyleSheet = newStyleSheetSet
عند الإعادة، سيحمل المتغيّر currentStyleSheetSet اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا، يُمكنك كذلك ضبط مجموعة صفحات الأنماط باستعمال هذه الخاصيّة. ضبط قيمة لهذه الخاصيّة مُكافئٌ لاستدعاء التّابع document.enableStyleSheetsForSet() باستخدام القيمة currentStyleSheetSet، ثمّ ضبط نفس القيمة للخاصية lastStyleSheetSet أيضًا. مُلاحظة: قيمة هذه الخاصيّة حيّة؛ تغيير الخاصيّة disabled على صفحات الأنماط سيُؤثّر على قيمة هذه الخاصيّة. مثال console.log("مجموعة صفحات الأنماط الجاري استعمالها حاليًّا:" + document.selectedStyleSheetSet);
document.selectedStyleSheetSet = ...
Document.designMode
تُستعمل الخاصيّة Document.designMode للتّحكّم فيما إذا أمكن تعديل كامِلِ المُستند أو لا. القيَم الصّالحة هي "on" و"off". وحسب المُواصفة، فالقيمة الافتراضيّة لهذه الخاصّية هي "off"، لكنّ القيمة تكون بأحرفٍ كبيرة (capitalized) في مُتصفّح Internet Explorer. البنية العامة var mode = document.designMode;
document.designMode = "on";
document.designMode = "off";
مثال جعْلُ مُستندِ عنصرِ <iframe> قابلًا للتّعديل: iframeNode.contentDocument.designMode = "on";
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard.
عرض (250 السابقة | 250 التالية) (20 | 50 | 100 | 250 | 500).
العنصر
يُعرِّف العنصر <tfoot> مجموعةً من الأسطر التي تُمثِّل خلاصةً لأعمدة العنصر <table>. مثال عن جدول فيه ثلاثة أقسام: ترويسة (عبر العنصر <thead>)، وجسم (عبر العنصر <tbody>)، وتذييل (عبر العنصر <tfoot>): <table>
<thead>
<tr>
<th>الترويسة 1</th>
<th>الترويسة 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>خلية عادية 1</td>
<td>خلية عادية 2</td>
...
العنصر
يُمثِّل العنصر <ul> قائمةً غير مرتبة من العناصر، التي تُعرَض على شكل قائمة منقطة عادةً. قائمة غير مرتبة <ul> فيها ثلاثة عناصر <li>: <ul>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ul>
بطاقة العنصر تصنيفات المحتوى محتوى تنظيمي. المحتوى المسموح عنصر <li> واحد أو أكثر، ويمكن لهذا العنصر أن يحتوي أيضًا على قوائم <ol> أو <ul> متشعبة داخله. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLUListElement ...
خيارات المترجم في TypeScript
يوضح الجدول التالي جميع الخيارات التي يمكن استعمالها مع مترجم TypeScript للتحكم بسير عمله والتعديل على سلوكه أثناء ترجمة الشيفرات. الخيار النوع القيمة الافتراضية الوصف --allowJs boolean false السماح بترجمة ملفّات JavaScript. --allowSyntheticDefaultImports boolean module === "system" أو أنّ الخيار --esModuleInterop مضبوط وقيمة module ليست es2015 أو esnext السماح للاستيرادات الافتراضية من الوحدات التي لا تحتوي على تصديرات افتراضيّة. هذا لا يؤثر على الشيفرة المولَّدة، ويؤثر فقط على آلية التحقق من الأنواع. --allowUnreachableCode boolean false لا تُخبِر عن الأخطاء ...
العنصر
يُمثِّل العنصر <dl> قائمة وصف (description list)، وهذا العنصر يتضمن مجموعةً من المصطلحات وشرحها. يستخدم هذا العنصر عادةً في القواميس أو شرح المصطلحات، أو لعرض البيانات الوصفية (قائمة من أزواج «مفاتيح-قيم»). بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح مجموعة أو أكثر من عناصر <dt> متبوعة بعنصر <dd> واحد أو أكثر؛ ويُسمَح باستخدام العنصر <div> فيه. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLDListElement دعم المتصفحات Chrome ...
String.fromCodePoint()
الدالة String.fromCodePoint() الساكنة (static) تُعيد سلسلةً نصيةً مُنشَأةً باستخدام سلسلة من قيم المحارف (code points). البنية العامة String.fromCodePoint(num1[, ...[, numN]])
num1, ..., numN سلسلة من الأرقام التي تُمثِّل قيم المحارف (code points). القيمة المعادة سلسلة نصية تحتوي على محارف ترتبط بقيم المحارف المُمرَّرة إلى الدالة. الاستثناءات سيرمى الاستثناء RangeError إذا مُرِّرَ قيمة محرف يونيكود غير صالحة (مثلًا: "RangeError: NaN is not a valid code point"). الوصف هذه الدالة تُعيد سلسلةً نصيةً أوليّةً ولا تُعيد كائن String. لمّا كانت الدالة fromCodePoint هي دالةٌ ...
التابع .delegate() في jQuery
.delegate( selector, eventType, handler ) أُهمِل مع الإصدار: 3.0. القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يُرفق هذا التابع معالج بأحد الأحداث أو أكثر لكافة العناصر التي تطابق المُحدِد، الآن أو في المستقبل، استنادًا إلى مجموعة محددة من العناصر الجذر. .delegate( selector, eventType, handler ) أُضيف مع الإصدار: 1.4.2. selector سلسلة نصية تُحدد ترشيح العناصر التي تبدأ الحدث من النوع String. eventType سلسلة نصية تحتوي على واحد أو أكثر من أنواع أحداث JavaScript مفصولة بمسافات، مثل "click"، أو "keydown,"، ...
التابع .mousemove() في jQuery
.mousemove( handler ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يربط هذا التابع معالج حدث معين مع الحدث mousemove (التحرك داخل العنصر) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر. .mousemove( handler ) أُضيف مع الإصدار: 1.0. handler دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث. .mousemove( [eventData ], handler ) أُضيف مع الإصدار: 1.4.3. eventData أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى إمكانيَّة استخدام أي ...
الكلمة المحجوزة this في JavaScript
الكلمة المحجوزة this لها سلوكٌ في JavaScript يختلف عن بقية لغات البرمجة، وهنالك اختلافاتٌ في سلوكها بين النمط strict و non-strict. في أغلبية الحالات، تُحدَّد قيمة الكلمة المحجوزة this وفق طريقة استدعاء الدالة، إذ لا يمكن ضبط قيمتها باستخدام عملية الإسناد العادية أثناء التنفيذ؛ وقد تختلف قيمة this في كل مرة تُستدعى فيها الدالة. أضافت ES5 الدالة bind التي تضبط قيمة this داخل الدالة بغض النظر عن طريقة استدعائها، وأضافت ES2015 الدوال السهمية (arrow functions) التي تُوفِّر ربطًا خاصًا بها ...
التابع .keypress() في jQuery
.keypress( handler ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يربط هذا التابع معالج حدث معين مع الحدث keypress (الضغط على مفتاح في لوحة المفاتيح) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر. .keypress( handler ) أُضيف مع الإصدار: 1.0. handler دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث. .keypress( [eventData ], handler ) أُضيف مع الإصدار: 1.4.3. eventData أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى ...
الحقل button
عناصر <input> ذات النوع button تُعرَض كأزرار عادية، والتي يمكن برمجتها للتحكم بأي شيء في الصفحة عبر ربط دالة معالجة أحداث معها (التي تُعالِج الحدث click عادةً). وعلى الرغم من أنَّ عناصر <input> ذات النوع button صحيحة تمامًا في HTML، لكن من المفضّل استخدام عنصر <button> الجديد لإنشاء الأزرار، لأن له ميزات إضافية، مثل دعمه للقيمة menu في الخاصية type التي تعني أنَّ الزر يستعمل لتفعيل قائمة منبثقة، والسماح بإضافة نص اللافتة للعنصر <button> بين وسم البداية ووسم النهاية مما ...
العنصر
يُجمِّع العنصر <tbody> عنصر <tr> أو أكثر كجسم للعنصر <table>. مثال عن جدول فيه جسم (العنصر <tbody>)، الذي يحتوي على سطرين (العنصر <tr>) وأربع خلايا (العنصر <td>): <table>
<tbody>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في ...
العنصر
يُمثِّل العنصر <meter> إما قيمةً عددية ضمن مجال معيّن، أو قيمةً جزئية (fractional value). مثال بسيط عن استخدام العنصر <meter> لعرض درجة الحرارة التي يجب ضبط الفرن عليها لطهي نوع معيّن من الطعام، لاحظ استخدام الخاصية min لتحديد أدنى قيمة (أقل درجة حرارة متاحة في الفرن) والخاصية max لتحديد أكبر قيمة (أكبر درجة حرارة يمكن تسخين الفرن إليها) والخاصية value لتحديد درجة الحرارة المطلوبة: <p>سخِّن الفرن إلى
<meter min="200" max="500" value="350">350 درجة مئوية</meter>.</p>
مثال عن استخدام العنصر <meter> لتمثيل درجة ...
العنصر
يُحدِّد العنصر <source> عدِّة مصادر لملفات الوسائط المتعددة ضمن العنصر <picture> أو <audio> أو <video>. وهذا العنصر فارغ، وأكثر استخدام شائع له هو توفير محتوى الوسائط المتعددة نفسه لكن بصيغ مختلفة لكي يستطيع المتصفح تشغيل أنسبها. يشرح هذا المثال كيفية توفير مقطع فيديو بصيغة webm لمن يدعم متصفحه فيديو WebM، وتوفير المقطع بصيغة MP4 للمستخدمين الذين يدعم متصفحهم هذه الصيغة. إن لم يكن العنصر <audio> أو <video> مدعومًا من المتصفح فستظهر رسالة تنبه المستخدم إلى ذلك؛ وإن لم يكن المتصفح ...
حالة المكونات في React
ماذا يفعل التابع setState؟ يُجدوِل التابع setState() تحديثًا لكائن حالة المكوّن state. عندما تتغير الحالة يستجب المكوّن بإعادة التصيير. ما الفرق بين الحالة state والخاصيّات props؟ الخاصيّات props (اختصارًا للكلمة properties) والحالة state كلاهما عبارة عن كائنات JavaScript مجرّدة. وفي حين أنّ كلاهما يحمل معلومات تؤثر في ناتج التصيير، فهما مختلفان بطريقة واحدة هامة، حيث تُمرَّر الخاصيّات إلى المكوّن (بشكل مماثل لمُعاملات الدالة) بينما تُدار الحالة state ضمن المكوّن (بشكل مشابه للمتغيرات المعرفة بداخل الدالة). هنا تجد مصادر جيدة لقراءة ...
الخاصيات العامة
الخاصيات العامة هي الخاصية التي يمكن استعمالها في جميع عناصر HTML، على الرغم من أنَّها قد لا يكون لها تأثير إن استعملت على بعض العناصر. يمكن أن تستعمل الخاصيات العامة على جميع عناصر HTML حتى لو لم تكن هذه العناصر موجودةً في المعيار، وهذا يعني أنَّ العناصر غير المعيارية يجب أن تسمح باستخدام هذه الخاصية، حتى لو كان استخدام هذه العناصر سيؤدي إلى جعل المستند غير متوافق مع معيار HTML5. فمثلًا ستخفي المتصفحات التي تدعم HTML5 المحتوى الموجود ضمن العنصر ...
العنصر
يُمثِّل العنصر <ol> قائمةً مرتبةً من العناصر، التي تُعرَض على شكل قائمة مرقمة. مثال عن قائمة مرتبة <ol> فيها ثلاثة عناصر <li>: <ol>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ol>
بطاقة العنصر تصنيفات المحتوى محتوى تنظيمي. المحتوى المسموح عنصر <li> واحد أو أكثر، ويمكن لهذا العنصر أن يحتوي أيضًا على قوائم <ol> أو <ul> متشعبة داخله. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLOListElement دعم ...
العنصر
يُعرِّف العنصر <colgroup> مجموعة أعمدة ضمن أحد الجداول. لمشاهدة مثال عن استخدام العنصر <colgroup>، راجع صفحة العنصر <table> والعنصر <col>. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح إذا كانت الخاصية span مستخدمة، فلا يوجد فهو عنصرٌ فارغ. أما إذا لم تكن الخاصية موجودةً، فالعنصر <col> صفر مرة أو أكثر. الوسم المختصر يمكن حذف وسم البداية إذا كان أوّل أبناء هذا العنصر هو عنصر <col> ولم يُسبَق هذا العنصر بعنصر <colgroup> حُذِفَ وسم إغلاقه. يمكن حذف وسم الإغلاق إذا لم يُتبَع هذا ...
العنصر
يُعرِّف العنصر <col> عمودًا ضمن أحد الجداول، ويُستخدم لإعطاء هيكل تنظيمي للخلايا المتشابهة، ويكون موجودًا داخل عنصر <colgroup>. مثال عن جدول فيه مجموعة من الأعمدة (العنصر <colgroup>) وعرّفنا داخله عمودًا (العنصر <col>) لون خلفيته أخضر: <table>
<colgroup>
<col style="background-color: #0f0">
</colgroup>
<tr>
<th>التفاح</th>
<th>الليمون</th>
<th>البرتقال</th>
</tr>
<tr>
<td>أخضر</td>
<td>أصفر</td>
<td>برتقالي</td>
</tr>
</table>
بطاقة العنصر تصنيفات المحتوى ...
العنصر
يُعرِّف العنصر <tr> سطرًا يحتوي على خلايا في جدول، وهذه الخلايا تُمثَّل عبر العنصرين <td> و <th>. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. ...
Document.evaluate()
يُنشئ التّابع Document.evaluate() كائنًا من النّوع XPathResult مبني على تعبير XPath ومعاملات معطاة أخرى. البنية العامة var xpathResult = document.evaluate(
xpathExpression,
contextNode,
namespaceResolver,
resultType,
result
);
xpathExpression سلسة نصيّة تُمثّل تعبير XPath المرغوب تقديره (evaluate). contextNode يُحدّد عقدة السّياق للاستعلام (انظر مواصفة XPath). من الشّائع تمرير كائن المستند document كعقدة سياق. namespaceResolver دالّة تُمرَّر لها سابقات مجالات الأسماء (namespace prefixes) لتُعيد سلسلةً نصيّة تُمثّل عنوان URI مجال الأسماء المرتبط بالسّابقة المُمرَّرة. ستُستعمل لحلّ السّابقات داخل تعبير XPath ...
العنصر
يُعرِّف العنصر <area> منطقةً في خريطة لصورة، ويمكن أن ترتبط تلك المنطقة (اختياريًا) مع رابط فائق. لا يمكن استخدام هذا العنصر إلا ضمن عنصر <map>. لمشاهدة مثال متكامل عن استخدام العنصر <area>، راجع صفحة العنصر <map>. بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي. المحتوى المسموح لا يوجد، فهو عنصرٌ فارغ. الوسم المختصر يجب أن يكون وسم البداية موجودًا، ويجب أن يُحذَف وسم النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي؛ لكن يجب أن يكون العنصر <area> متواجدًا ضمن ...
التابع .fadeToggle() في jQuery
.fadeToggle( [duration ] [, easing ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة أو يخفيها عن طريق تحريك درجة العتامة. .fadeToggle( [duration ] [, easing ] [, complete ] ) أُضيف مع الإصدار: 1.4.4. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. easing (القيمة الافتراضية: swing) سلسلة نصية من النوع String، تُشير إلى دالة التخفيف المستخدمة في عملية التحوّل. complete دالة على الشكل ...
العنصر
يُستعمَل العنصر <audio> لتضمين المحتوى الصوتي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب الملفات الصوتية لتشغيلها. المثال الآتي يستخدم العنصر <audio> مع الخاصية autoplay لتشغيل الصوت تلقائيًا مع تحديد رابط URL للملف المصدري عبر الخاصية src: <audio src="khamsat.mp3" autoplay>
لا يدعم متصفحك العنصر <code>audio</code>.
</audio>
أما المثال الآتي ففيه العنصر <audio> مع استخدام خاصية controls لإضافة أزرار للتحكم بالمقطع، وسيُحدَّد رابط URL للمقطع عبر العنصر <source>: ...
التابع .fadeIn() في jQuery
.fadeIn( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة عن طريق تحويلها إلى الإعتام (opaque، أي لن تصبح شفافةً) تدريجيًا. .fadeIn( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .fadeIn( options ) أُضيف مع الإصدار: 1.0. options ...
العنصر
يُعرِّف العنصر <th> خليةً تُمثِّل ترويسةً في الجدول الذي يحتويها. تُعرّف طبيعة هذه الترويسة عبر الخاصيتين scope و headers. مثال عن استخدام الخاصية scope لتحديد ما هي الخلايا التي تُمثِّلها ترويسة ما: <table>
<caption>معلومات التواصل</caption>
<tbody>
<tr>
<th scope="col">الاسم</th>
<th scope="col">رقم الهاتف</th>
<th scope="col">المدينة</th>
</tr>
<tr>
<th scope="row">الموظف 1</th>
...
تعليمات الشرطات المائلة الثلاث في TypeScript
مقدمة تعليمات الشرطات المائلة الثلاث (Triple-slash directives) هي تعليقات تكتب في سطر واحد تحتوي على وسم XML واحد. تُستخدَم محتويات التعليق كتعليمات (إرشادات) للمترجم. تكون تعليمات الشرطات المائلة الثلاث صالحةً فقط في أعلى الملفّ الذي تكون هذه التعليمات موجودة داخله. ويُمكن لهذه التعليمات أن تُسبَق فقط بتعليق في سطر واحد أو تعليق متعدّد الأسطر (multi-line comment)، ما يشمل تعليمات شرطات مائلة ثلاث أخرى. إذا وُجِدَت بعد جملة أو تصريح فستُعامَل على أنها تعليقات عادية في سطر واحد (regular single-line comments)، ...
العنصر
يُعرِّف العنصر <td> خليةً في الجدول الذي يحتويها. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح المحتوى التنظيمي. الوسم المختصر لا ...
العنصر
يُحدِّد العنصر <link> العلاقات بين المستند الحالي وبين مورد خارجي (external resource)؛ من استخدامات هذا الوسم تتضمن تعريف علاقة بين الصفحات للتنقل بينها، بيد أنَّ أكثر استخدامات هذا العنصر شيوعًا هو تضمين صفحات الأنماط. استخدام الشكل الآتي للعنصر <link> لتضمين صفحة أنماط في المستند: <link href="style.css" rel="stylesheet">
بطاقة العنصر تصنيفات المحتوى البيانات الوصفية المحتوى المسموح لا يوجد، فهذا العنصر فارغ. الوسم المختصر لمّا كان هذا العنصر فارغًا، فيجب توفير وسم البداية وحذف وسم النهاية. العناصر الأب أي عنصر يقبل وجود ...
العنصر
يُمثِّل العنصر <button> زرًا قابلًا للضغط. مثال عن استخدام العنصر <button>: <button name="button">اضغط هنا</button>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي وعنصر عادي، وعنصر تفاعلي ... المحتوى المسموح المحتوى العادي. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي. واجهة DOM HTMLButtonElement دعم المتصفحات Chrome Firefox Edge Safari Opera مدعوم مدعوم مدعوم مدعوم مدعوم الخاصيات يمكن استخدام الخاصيات العامة في هذا العنصر. autofoucs تسمح لنا هذه الخاصية المنطقية (Boolean) بتحدد أنَّنا نريد ...
العنصر
يُمثِّل العنصر <form> قسمًا في المستند الذي يحتوي على عناصر يستطيع المستخدم التفاعل معها لإرسال بيانات إلى خادوم الويب. مثال بسيط عن نموذج يُرسَل عبر الطريقة GET: <form action="" method="get">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال بسيط عن نموذج يُرسَل عبر الطريقة POST: <form action="" method="post">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال عن نموذج يبيّن استخدام العناصر <fieldset> و <legend> و <label>: <form action="" method="post">
<fieldset>
...
العنصر
يُستعمَل العنصر <video> لتضمين المحتوى المرئي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب صيغة لتشغيلها. مثال عن استخدام العنصر <video> لإضافة مقطع فيديو بصيغة WebM (عبر الخاصية src) بارتفاع 360، مع عرض عناصر التحكم (عبر الخاصية controls) وله صورة غلاف تُعرَض إلى أن يبدأ تشغيله (الخاصية poster)، وستُعرَض رسالة نصية تنوِّه المستخدم أنَّ متصفحه لا يدعم العنصر <video>: <video src="khamsat.webm" controls poster="khamsat-poster.jpg" height="360">
لا ...
التابع .slideDown() في jQuery
()slideDown. القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يُظهِر هذا التابع جميع العناصر المتطابقة مع حركة انسحابيَّة. .slideDown( [duration ] [, complete ] ) أضيف مع الإصدار 1.0. duration عدد أو سلسلة نصية تمثِّل كمية الوقت الذي ستستغرقه عملية تحريك العنصر، وقيمته الافتراضيَّة هي 400. complete دالةٌ من الشكل Function() وتُستدعَى مرةً وحدةً مع كل عنصر من العناصر المطابقة بعد اكتمال الحركة المطبَّقة عليه. .slideDown( options ) أضيف مع الإصدار: 1.0. Options كائن من النوع Object، وهو مجموعة من ...
التابع .toggle() في jQuery
.toggle( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يبدِّل هذا التابع حالة العناصر المُطابقة بين العرض و الإخفاء. .toggle( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .toggle( options ) أُضيف مع الإصدار: 1.0. options كائن من النوع Object، ويقدم مجموعة من ...
Document.getElementsByClassName()
يُعيد التّابع Document.getElementsByClassName() كائنًا مُشابهًا للمصفوفات يحتوي على جميع العناصر الأولاد التي تحمل نفس اسم الصّنف (class name) المُعطى. عند استدعائه على كائن المُستند، فسيُبحَثُ في كامل المُستند، ما يشمل العقدة الجذر. يُمكن كذلك استدعاء التّابع getElementsByClassName() على أي عنصر؛ وسيُعيد العناصر الأولاد للعنصر الجذر المُحدَّد ذات أسماء الأصناف المعطاة. البنية العامة var elements = document.getElementsByClassName(names);
// أو
var elements = rootElement.getElementsByClassName(names);
elements كائنٌ حيّ من النّوع HTMLCollection الذي يُمثّل مجموعة العناصِر التي وُجدت. names سلسلةٌ نصيّةٌ تُمثّل قائمة أسماء الأصناف المرغوب ...
Document.queryCommandSupported()
يشير التّابع Document.queryCommandSupported() إلى ما إذا كان أمر التّحرير المعطى مدعومًا من طرف المتصفّح أم لا. البنية العامة isSupported = document.queryCommandSupported(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أم لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مدعومًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandSupported("SelectAll");
if(flg) {
// نفّذ عمليّةً ما
}
ملاحظات يعيد الأمر 'paste' القيمة false في حالة لم يكن الأمر متاحًا إضافةً إلى حالة كون السكربت المستدعي ...
Document.fullscreenElement
تُعيد الخاصية Document.fullscreenElement القابلة للقراءة فقط العنصر Element الذي في وضع ملء الشاشة حاليًا ضمن عناصر المستند الحالي، أو تُعيد القيمة null في حالة لم يكن وضع ملء الشاشة مُفعلًا. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var element = document.fullscreenElement;
ستكون قيمة المتغيّر element هي إشارةٌ إلى العنصر الموجود في وضع ملء الشاشة حاليًا، أو القيمة null في حالة ...
Document.createCDATASection()
يُنشئُ التّابع Document.createCDATASection() عقدةَ قسم CDATA جديدةً ويُعيدها. البنية العامة CDATASectionNode = document.createCDATASection(data)
CDATASectionNode يُمثّل عقدةً من النّوع CDATASection. data سلسلةٌ نصيّة تحتوي على البيانات المرغوب إضافتها إلى قسم CDATA. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml")
var cdata = docu.createCDATASection('هنا عقدة البيانات');
docu.getElementsByTagName('xml')[0].appendChild(cdata);
alert(new XMLSerializer().serializeToString(docu));
// ستَعرضُ
// <xml><![CDATA[هنا عقدة البيانات]]></xml>
ملاحظات يعمل هذا مع مستندات XML فقط، ولا يعمل مع مستندات HTML (لأنّ مُستندات HTML لا تدعم أقسام CDATA)؛ مُحاولة استعمال التّابع مع مُستندات HTML سترمي الاستثناء NOT_SUPPORTED_ERR. سترمي كذلك الاستثناء NS_ERROR_DOM_INVALID_CHARACTER_ERR ...
Document.createExpression()
يُجمّع التّابع Document.createExpression() استعلام XPathExpression، والذي يُمكن استعماله بعد ذلك لإجراء تقديرات (evaluations) يُمكن تكرارها. البنية العامة xpathExpr = document.createExpression(xpathText, namespaceURLMapper);
xpathText سلسلة نصيّة تُمثّل تعبير XPath المرغوب تجميعه. namespaceURLMapper دالّة تربط سابقة مجال أسماءٍ (namespace prefix) برابط URL مجال أسماءٍ أو القيمة null إن لم يكن ذلك مطلوبًا. القيمة المعادة كائنٌ من النّوع XPathExpression.
Document.onfullscreenchange
الخاصيّة Document.onfullscreenchange مُعالِج أحداثٍ للحدث fullscreenchange الذي يُطلَق عندما يلِج أو يخرج مُستندٌ من وضع ملء الشّاشة. البنية العامة targetDocument.onfullscreenchange = fullscreenChangeHandler;
مثال document.onfullscreenchange = function ( event ) {
console.log("هناك تغيّر في وضع ملء الشّاشة")
};
document.documentElement.onclick = function () {
// يجب استدعاء التّابع
// requestFullscreen()
// داخل مُعالج أحداث لكي لا يفشَل استدعاؤه
document.documentElement.requestFullscreen();
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي 45 47 وراء full-screen-api.unprefix.enabled ؟ ؟ ؟ ...
Document.location
تُعيد الخاصيّة Document.location القابلة للقِراءة فقط كائنًا من النّوع Location، والذي يحتوي على معلومات حول عنوان URL الخاصّ بالمُستند ويُتيح توابع لتعديل عنوان URL هذا وتحميل عنوان URL آخر. ورغم أنّ الخاصيّة Document.location للقِراءة فقط، إلا أنّك تستطيع تعيين سلسلة نصيّة من النّوع DOMString لها كذلك. ما يعني بأنّك تستطيع التّعامل مع هذه الخاصيّة بصفتها سلسلة نصيّة عاديّة في مُعظم الحالات. والسّطران التّاليّان مُتكافئان: document.location = 'http://www.example.com'
document.location.href = 'http://www.example.com'
للحصول على عنوان URL المُستندِ وحده، يُمكنك استعمال الخاصيّة document.URL كذلك. ...
Document.createComment()
يُنشئُ التّابع Document.createComment() عقدةَ تعليق جديدةً ويُعيدها. البنية العامة CommentNode = document.createComment(data)
data سلسلةٌ نصيّة تحتوي على التعليق المرغوب إضافته. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml");
var comment = docu.createComment('هذا تعليق');
docu.getElementsByTagName('xml')[0].appendChild(comment);
alert(new XMLSerializer().serializeToString(docu));
// تعرض
// <xml><!--هذا تعليق--></xml>
مصادر ومواصفات مواصفة createComment
Document.queryCommandEnabled()
يشير التّابع Document.queryCommandEnabled() إلى ما إذا كان أمر التّحرير المعطى مفعّلًا من طرف المتصفّح أم لا. البنية العامة isEnabled = document.queryCommandEnabled(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أو لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مُفعّلًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandEnabled("SelectAll");
if(flg) {
document.execCommand("SelectAll", false, null); // الأمر مُفعّل، لذا نفّذه
}
ملاحظات بالنّسبة للأمران 'cut' و'copy' فإنّ التّابع يعيد القيمة true فقط إن استدعيَ في ...
Document.fullscreenEnabled
تُعيد الخاصية Document.fullscreenEnabled القابلة للقراءة فقط كائنًا من النوع Boolean يُشير إلى ما إذا كان وضع ملء الشاشة مُتاحًا أم لا. وضع ملء الشاشة مُتاح للصفحات التي لا تحتوي على إضافات ذات نوافِذَ في أي من مُستنداتها فقط، وفي حالة كانت جميع عناصر <iframe> التي تحوي المُستند ذات خاصيّة allowfullscreen مضبوطة. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var isFullscreenAvailable ...
Document.dir
الخاصيّة Document.dir خاصيّةٌ من النّوع DOMString تُمثّل اتّجاهيّة النّص في المُستند، إمّا من اليسار إلى اليمين (وهو الخيار الافتراضي) أو من اليمين إلى اليسار. القيَم المُمكنة هي 'rtl' أي من اليمين إلى اليسار، والقيمة 'ltr' التّي تعني من اليسار إلى اليمين. البنية العامة dirStr = document.dir;
document.dir = dirStr;
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم ؟ ؟ مصادر ومواصفات مواصفة HTML Living Standard.
Document.defaultView
في المُتصفحات، تُعيد الخاصيّة Document.defaultView الكائن window المُرتبط بالمستند، أو القيمة null إن لم يكن متوافرًا. البنية العامة var win = document.defaultView;
الخاصيّة قابلة للقراءة فقط. دعم المتصفحات الميزة Chrome Edge Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard. مواصفة HTML5.
Document.exitPointerLock()
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. يُحرّر التّابع Document.exitPointerLock() قفل مؤشّر الفأرة بشكل غير مُتزامنٍ حسب طلبٍ سابقٍ من Element.requestPointerLock. للتحقّق من نجاح أو فشل الطّلب، لابدّ من الاستماع للحدثين pointerlockchange وpointerlockerror. البنية العامة document.exitPointerLock();
دعم المتصفحات الميزة Chrome Edge Firefox Internet Explorer Opera Safari الدعم الأساسي نعم (قد تحتاج إلى السّابقة -webkit في إصدارات قديمة) نعم نعم، مع السّابقة -moz 50 دون سابقة ؟ ؟ ؟ انظر أيضًا Document.pointerLockElement Element.requestPointerLock مصادر ومواصفات ...
Document.head
تُعيد الخاصية document.head العنصر <head> الخاصّ بالمُستند الحالي. إن كان للمُستند أكثر من عنصر <head> واحد، فالقيمة المُعادة ستُمثّل العنصر الأول. البنية العامة var objRef = document.head;
مثال // نضع ما يلي
// في ملفّ
// HTML
// <head id="my-document-head">
var aHead = document.head;
alert(aHead.id); // "my-document-head";
alert( document.head === document.querySelector("head") ); // true
ملاحظات الخاصيّة document.head للقِراءة فقط. مُحاولة ضبط قيمة لها سيفشَل دون أي أخطاء، أو سيرمي خطأ TypeError في مُتصفّح Firefox في حالة كان المستند في نمط strict. دعم المتصفحات الميزة Chrome Edge ...
Document.preferredStyleSheetSet
تُعيد مجموعة صفحات الأنماط المُفضّلة حسب ما ضبطه كاتب الصّفحة. وهي للقراءة فقط. البنية العامّة preferredStyleSheetSet = document.preferredStyleSheetSet
تُشير قيمة المتغيّر preferredStyleSheetSet إلى مجموعة صفحات الأنماط المُفضّلة من طرف كاتب الصّفحة. يُحدَّدُ هذا من خلال ترتيب تعريفات صفحات الأنماط وترويسة HTTP ذات العنوان Default-Style. إن لم تكن هناك مجموعة صفحات أنماط مُفضَّلة من طرف الكاتب، فستكون القيمة المُعادة سلسلةً نصية فارغة (""). مثال if (document.preferredStyleSheetSet) {
console.log("مجموعة صفحات الأنماط المُفضّلة هي:" + document.preferredStyleSheetSet);
} else {
console.log("لا توجد صفحة ...
Document.onselectionchange
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. الخاصيّة Document.onselectionchange مُعالِج أحداثٍ للحدث selectionchange الذي يُطلَق عندما يتغيّر تظليل الكائن. البنية العامة obj.onselectionchange = function;
المُتغيّر function هي دالّة عرّفها المُستخدم user-defined، دون اللاحقة () أو أية مُعاملات، أو تعريفٌ لدالّةٍ مجهولة (anonymous function). مثال document.onselectionchange = function() { console.log("لقد تغيّر التّظليل"); };
دعم المتصفحات الميزة Chrome Internet Explorer Edge Firefox Opera Safari الدعم الأساسي 49 ؟ نعم 45 ؟ ؟ انظر أيضًا selectionchange selectstart ...
Document.timeline
تنبيه: هذه تقنيّة تجريبيّة، انظر جدول دعم المُتصفحات قبل استعمال هذه الخاصيّة في شيفرة إنتاجيّة. تُعيد الخاصيّة القابلة للقراءة فقط timeline المُعرَّفة على الواجهة Document الخطَّ الزمني الافتراضي للمُستند الحالي. هذا الخط الزّمني كائن خاص من النوع DocumentTimeline الذي يُنشأ تلقائيا عند تحميل الصّفحة. الخطّ الزمني فريد لكل مستند ويبقى طيلة مُدّة بقاء المُستند حيًّا، ما يشمل استدعاءات التّابع document.open(). تُحسب القيم الزمنية لهذا الخط الزمني حسب حدّ ثابت (fixed offset) من السّاعة العموميّة بحيث يُكافئ وقتُ الصّفر (zero time) ...
Document.write()
يكتب التّابع Document.write() سلسلةً نصيّةً إلى مجرى (stream) مستندٍ فُتح بالتّابع window.open(). مُلاحظة: لأنّ التّابع Document.write() يكتب إلى مجرى المستند، فاستدعاؤه على مستندٍ مُغلقٍ (مُحمَّل) يستدعي تلقائيًّا التّابع Document.open()، الذي سيحذف محتويات المستند. البنية العامة document.write(markup);
markup سلسلة نصيّة تحتوي على النّص المرغوب كتابته على المستند. مثال <!DOCTYPE html>
<html>
<head>
<title>write مثال</title>
<script>
function newContent() {
alert("تحميل محتوى جديد");
document.open();
document.write("<h1>المحتوى ...
Document.visibilityState
تُعيد الخاصيّة Document.visibilityState القابلة للقراءة فقط حالةَ ظهور المُستند، أي سياق وضوح العنصر الحالي. إذ من المُفيد معرفة ما إذا كان المُستند في الخلفيّة أو في تبويب (لسان، tab) غير مرئي حاليًّا، أو أنّ الصّفحة قد حُمّلت فقط من أجل ما قبل التّصيير (pre-rendering). القيم المُمكنة هي كما يلي: 'visible': تُشير إلى أنّ مُحتويات الصّفحة قد تكون ظاهرة ولو جزئيّا. هذا يعني بأنّ الصفحة موجودة على تبويب أمامي في نافذة غيرِ مُصغّرة. 'hidden': مُحتويات الصّفحة غير واضحة للمستخدم. هذا يعني ...
Document.execCommand()
عندما ينتقل مستند HTML إلى نمط التّصميم designMode فإنّ كائن المستند يوفّر التّابع Document.execCommand() الذي يسمح للمستخدم بتنفيذ الأوامر للتعامل مع محتويات المنطقة القابلة للتّعديل. تؤثّر معظم هذه الأوامر على محتويات المستند الموجودة (تعديل النصوص لجعلها بخط عريض أو مائل مثلًا)، فيما تُدخِل بعض الأوامر الأخرى عناصر جديدة (مثل إضافة رابط) أو تؤثّر على كامل السّطر (مثل إزاحته). عند استخدام الخاصيّة contentEditable، فاستدعاء التّابع Document.execCommand() يؤثّر على العنصر المُفعّل القابل للتعديل حاليًّا. البنية العامة bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)
القيمة ...
Document.enableStyleSheetsForSet()
يفعّل التّابع Document.enableStyleSheetsForSet() صفحات الأنماط التي توافق الاسم المُحدّد في مجموعة صفحات الأنماط الحاليّة، ويُعطّل جميع صفحات الأنماط الأخرى (عَدا تلك التي بدون عنوان، والتي تكون دائمًا مُفعّلة). البنية العامة document.enableStyleSheetsForSet(name)
name اسم صفحات الأنماط المرغوب تفعيلها. ستُفعّل جميع صفحات الأنماط التي توافق هذا الاسم، لكن ستُعطَّل جميع صفحات الأنماط الأخرى التي تملك عنوانًا. مرّر سلسلةً نصيّةً فارغةً لهذا المُعامل لتعطيل جميع صفحات الأنماط البديلة والمُفضّلة (دون صفحات الأنماط الدّائمة التي لا تملك خاصّية title). ملاحظات تُوافَقُ العناوين يكون حسّاسًا ...
Document.hasFocus()
يُعيد التّابع Document.hasFocus() قيمة منطقيّة من النّوع Boolean تدلّ على ما إذا كان المستند أو أي عنصرٍ داخل المستند مُركَّزًا عليه أو لا. يُستعمل هذا التّابع لتحديد ما إذا كان العنصر المفعّل في مستند مُركَّزًا عليه أو لا. ملاحظة: عند عرض مستندٍ ما، فالعنصر المُركّز عليه هو دائمًا العنصر المفعّل في المستند، لكنّ العنصر المفعّل لا يكون دائمًا مُركَّزًا عليه بالضّرورة. على سبيل المثال، عنصر مُفعّل داخل نافذة منبثقة في الخلفيّة لا يكون مركّزًا عليه. البنية العامة focused = document.hasFocus();
...
Document.hidden
تُعيد الخاصيّة Document.hidden قيمة منطقيّة تُشير إلى ما إذا كانت الصّفحة مخفية أم لا. لاحظ أنّ هذه الخاصّية قابلة للقراءة فقط. البنية العامّة var boolean = document.hidden
مثال document.addEventListener("visibilitychange", function() {
console.log( document.hidden );
// افعل شيئا ما
});
دعم المتصفحات الميزة Chrome Firefox Internet Explorer Opera Safari الدعم الأساسي 13 مع السابقة -webkit- ، 33 دون سابقة. 18 10 12.10 7 مصادر ومواصفات مواصفة Page Visibility (Second Edition).
Document.querySelector()
يُعيد التّابع Document.querySelector() أول كائنٍ من النّوع Element الذي يُمثّل العنصر المُوافِق للمُحدِّد أو المحدّدات المعطاة. ويُعيد القيمة null في حالة لم يجِد أيّ عنصر. مُلاحظة: يتمّ البحث باستعمال المرور على العمق أولًا قبل التّرتيب (depth-first pre-order traversal) حول عقد المستند بدايةً من أول عنصر في هيكل المستند ويُكرّر (iterating) حول العقد في القائمة مرتّبةً حسب عدد العقد الأبناء. البنية العامة element = document.querySelector(selectors);
selectors سلسلة نصيّة من النّوع DOMString تحتوي على مُحدّد واحدٍ أو أكثر لمُوافقته مع عناصر المستند ...
Document.scripts
خاصيّة قابلة للقراءة فقط تُعيد جميع عناصر <script> في المُستند. والقيمة المُعادة كائنٌ من النّوع HTMLCollection. البنية العامة var scriptList = document.scripts;
القيمة المُعادة كائنٌ من النّوع HTMLCollection. يُمكنك التّعامل مع المُتغيّر scriptList كما تتعامل مع أي مصفوفة للوصول إلى جميع العناصر في القائمة. مثال المثال التّالي يتحقّق ممّا إذا كان للصّفحة الحاليّة أي عنصر <script>: var scripts = document.scripts;
if (scripts.length) {
alert("هذه الصّفحة تحتوي على سكربتات");
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم ...
Document.writeln()
يكتب التّابع Document.writeln() سلسلةً نصيّةً متبوعةً بمحرف سطرٍ جديدٍ (newline character) على المستند. البنية العامة document.writeln(line);
line سلسلة نصيّة تحتوي على سطر النّص المرغوب إضافته. مثال document.writeln("<p>أدخل كلمة المرور</p>");
ملاحظات التّابع Document.writeln() مشابه للتّابع Document.write() لكنّه يُضيف سطرًا جديدًا. كما هو الحال مع التّابع Document.write() فالتّابع Document.writeln() لا يعمل كذلك في مستندات XHTML، وستحصل على خطأ NS_ERROR_DOM_NOT_SUPPORTED_ERR يفيد بأنّ العمليّة غير مدعومة في سطر أوامر الأخطاء. يحدث هذا عن محاولة فتح ملفّ محليّ ذو الامتداد .xhtml أو أي مستندٍ مُقدَّمٍ ...
Document.plugins
تُعيد الخاصيّة Document.plugins مجموعةً من النّوع HTMLCollection تحتوي على قائمة بجميع عناصر <embed> الموجودة في المُستند الحاليّ. كلّ عنصر في المجموعة يُعدّ من النّوع HTMLEmbedElement، يُمكن أن يكون عدد العناصِر واحدًا أو أكثر، وفي حالة لم يوجَد أي عنصر، فستُعاد القيمة null. مُلاحظة: للحصول على قائمة بالإضافات (plugins) المُنصَّبة، استعمل الخاصيّة NavigatorPlugins.plugins. البنية العامة embedArrayObj = document.plugins
مصادر ومواصفات مواصفة HTML Living Standard
Document.embeds
تُعيد الخاصّية embeds قائمةً بالكائنات المُضمّنة داخل المُستند الحالي. البنية العامة nodeList = document.embeds
مصادر ومواصفات مواصفة HTML Living Standard.
Document.lastModified
تُعيد الخاصية document.lastModified سلسلةً نصيةً تحتوي على تاريخ ووقتِ آخر تعديلٍ للمُستند الحاليّ. البنية العامة string = document.lastModified;
مثال طريقة الاستعمال البسيطة: alert(document.lastModified);
// يُعيد تاريخا مُشابها لما يلي
// 03/22/2018 05:20:48
تحويل قيمة lastModified إلى كائن من النّوع Date: var oLastModif = new Date(document.lastModified);
تحويل قيمة lastModified إلى عدد الأجزاء من ألف جزء من الثّانيّة التّي مرّت منذ 1 يناير 1970 على السّاعة 00:00:00: var nLastModif = Date.parse(document.lastModified);
ملاحظات لاحظ بأنّه لا يُمكن استعمال السّلسة النّصيّة التي تُعيدها الخاصيّة lastModified ...
Document.selectedStyleSheetSet
تُعيد اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا. البنية العامة currentStyleSheetSet = document.selectedStyleSheetSet
document.selectedStyleSheet = newStyleSheetSet
عند الإعادة، سيحمل المتغيّر currentStyleSheetSet اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا، يُمكنك كذلك ضبط مجموعة صفحات الأنماط باستعمال هذه الخاصيّة. ضبط قيمة لهذه الخاصيّة مُكافئٌ لاستدعاء التّابع document.enableStyleSheetsForSet() باستخدام القيمة currentStyleSheetSet، ثمّ ضبط نفس القيمة للخاصية lastStyleSheetSet أيضًا. مُلاحظة: قيمة هذه الخاصيّة حيّة؛ تغيير الخاصيّة disabled على صفحات الأنماط سيُؤثّر على قيمة هذه الخاصيّة. مثال console.log("مجموعة صفحات الأنماط الجاري استعمالها حاليًّا:" + document.selectedStyleSheetSet);
document.selectedStyleSheetSet = ...
Document.designMode
تُستعمل الخاصيّة Document.designMode للتّحكّم فيما إذا أمكن تعديل كامِلِ المُستند أو لا. القيَم الصّالحة هي "on" و"off". وحسب المُواصفة، فالقيمة الافتراضيّة لهذه الخاصّية هي "off"، لكنّ القيمة تكون بأحرفٍ كبيرة (capitalized) في مُتصفّح Internet Explorer. البنية العامة var mode = document.designMode;
document.designMode = "on";
document.designMode = "off";
مثال جعْلُ مُستندِ عنصرِ <iframe> قابلًا للتّعديل: iframeNode.contentDocument.designMode = "on";
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard.
عرض (250 السابقة | 250 التالية) (20 | 50 | 100 | 250 | 500).
العنصر
يُمثِّل العنصر <ul> قائمةً غير مرتبة من العناصر، التي تُعرَض على شكل قائمة منقطة عادةً. قائمة غير مرتبة <ul> فيها ثلاثة عناصر <li>: <ul>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ul>
بطاقة العنصر تصنيفات المحتوى محتوى تنظيمي. المحتوى المسموح عنصر <li> واحد أو أكثر، ويمكن لهذا العنصر أن يحتوي أيضًا على قوائم <ol> أو <ul> متشعبة داخله. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLUListElement ...
خيارات المترجم في TypeScript
يوضح الجدول التالي جميع الخيارات التي يمكن استعمالها مع مترجم TypeScript للتحكم بسير عمله والتعديل على سلوكه أثناء ترجمة الشيفرات. الخيار النوع القيمة الافتراضية الوصف --allowJs boolean false السماح بترجمة ملفّات JavaScript. --allowSyntheticDefaultImports boolean module === "system" أو أنّ الخيار --esModuleInterop مضبوط وقيمة module ليست es2015 أو esnext السماح للاستيرادات الافتراضية من الوحدات التي لا تحتوي على تصديرات افتراضيّة. هذا لا يؤثر على الشيفرة المولَّدة، ويؤثر فقط على آلية التحقق من الأنواع. --allowUnreachableCode boolean false لا تُخبِر عن الأخطاء ...
العنصر
يُمثِّل العنصر <dl> قائمة وصف (description list)، وهذا العنصر يتضمن مجموعةً من المصطلحات وشرحها. يستخدم هذا العنصر عادةً في القواميس أو شرح المصطلحات، أو لعرض البيانات الوصفية (قائمة من أزواج «مفاتيح-قيم»). بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح مجموعة أو أكثر من عناصر <dt> متبوعة بعنصر <dd> واحد أو أكثر؛ ويُسمَح باستخدام العنصر <div> فيه. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLDListElement دعم المتصفحات Chrome ...
String.fromCodePoint()
الدالة String.fromCodePoint() الساكنة (static) تُعيد سلسلةً نصيةً مُنشَأةً باستخدام سلسلة من قيم المحارف (code points). البنية العامة String.fromCodePoint(num1[, ...[, numN]])
num1, ..., numN سلسلة من الأرقام التي تُمثِّل قيم المحارف (code points). القيمة المعادة سلسلة نصية تحتوي على محارف ترتبط بقيم المحارف المُمرَّرة إلى الدالة. الاستثناءات سيرمى الاستثناء RangeError إذا مُرِّرَ قيمة محرف يونيكود غير صالحة (مثلًا: "RangeError: NaN is not a valid code point"). الوصف هذه الدالة تُعيد سلسلةً نصيةً أوليّةً ولا تُعيد كائن String. لمّا كانت الدالة fromCodePoint هي دالةٌ ...
التابع .delegate() في jQuery
.delegate( selector, eventType, handler ) أُهمِل مع الإصدار: 3.0. القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يُرفق هذا التابع معالج بأحد الأحداث أو أكثر لكافة العناصر التي تطابق المُحدِد، الآن أو في المستقبل، استنادًا إلى مجموعة محددة من العناصر الجذر. .delegate( selector, eventType, handler ) أُضيف مع الإصدار: 1.4.2. selector سلسلة نصية تُحدد ترشيح العناصر التي تبدأ الحدث من النوع String. eventType سلسلة نصية تحتوي على واحد أو أكثر من أنواع أحداث JavaScript مفصولة بمسافات، مثل "click"، أو "keydown,"، ...
التابع .mousemove() في jQuery
.mousemove( handler ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يربط هذا التابع معالج حدث معين مع الحدث mousemove (التحرك داخل العنصر) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر. .mousemove( handler ) أُضيف مع الإصدار: 1.0. handler دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث. .mousemove( [eventData ], handler ) أُضيف مع الإصدار: 1.4.3. eventData أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى إمكانيَّة استخدام أي ...
الكلمة المحجوزة this في JavaScript
الكلمة المحجوزة this لها سلوكٌ في JavaScript يختلف عن بقية لغات البرمجة، وهنالك اختلافاتٌ في سلوكها بين النمط strict و non-strict. في أغلبية الحالات، تُحدَّد قيمة الكلمة المحجوزة this وفق طريقة استدعاء الدالة، إذ لا يمكن ضبط قيمتها باستخدام عملية الإسناد العادية أثناء التنفيذ؛ وقد تختلف قيمة this في كل مرة تُستدعى فيها الدالة. أضافت ES5 الدالة bind التي تضبط قيمة this داخل الدالة بغض النظر عن طريقة استدعائها، وأضافت ES2015 الدوال السهمية (arrow functions) التي تُوفِّر ربطًا خاصًا بها ...
التابع .keypress() في jQuery
.keypress( handler ) القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يربط هذا التابع معالج حدث معين مع الحدث keypress (الضغط على مفتاح في لوحة المفاتيح) في JavaScript، أو يستدعي ذلك الحدث لتطبيقه على عنصر. .keypress( handler ) أُضيف مع الإصدار: 1.0. handler دالة من الشكل Function( Event eventObject )، وتُمثِّل الدالة التي ستُنفَّذ في كل مرة يُستدعى فيها الحدث. .keypress( [eventData ], handler ) أُضيف مع الإصدار: 1.4.3. eventData أي شيء (وهو نوع افتراضي مُستخدَم في jQuery للإشارة إلى ...
الحقل button
عناصر <input> ذات النوع button تُعرَض كأزرار عادية، والتي يمكن برمجتها للتحكم بأي شيء في الصفحة عبر ربط دالة معالجة أحداث معها (التي تُعالِج الحدث click عادةً). وعلى الرغم من أنَّ عناصر <input> ذات النوع button صحيحة تمامًا في HTML، لكن من المفضّل استخدام عنصر <button> الجديد لإنشاء الأزرار، لأن له ميزات إضافية، مثل دعمه للقيمة menu في الخاصية type التي تعني أنَّ الزر يستعمل لتفعيل قائمة منبثقة، والسماح بإضافة نص اللافتة للعنصر <button> بين وسم البداية ووسم النهاية مما ...
العنصر
يُجمِّع العنصر <tbody> عنصر <tr> أو أكثر كجسم للعنصر <table>. مثال عن جدول فيه جسم (العنصر <tbody>)، الذي يحتوي على سطرين (العنصر <tr>) وأربع خلايا (العنصر <td>): <table>
<tbody>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في ...
العنصر
يُمثِّل العنصر <meter> إما قيمةً عددية ضمن مجال معيّن، أو قيمةً جزئية (fractional value). مثال بسيط عن استخدام العنصر <meter> لعرض درجة الحرارة التي يجب ضبط الفرن عليها لطهي نوع معيّن من الطعام، لاحظ استخدام الخاصية min لتحديد أدنى قيمة (أقل درجة حرارة متاحة في الفرن) والخاصية max لتحديد أكبر قيمة (أكبر درجة حرارة يمكن تسخين الفرن إليها) والخاصية value لتحديد درجة الحرارة المطلوبة: <p>سخِّن الفرن إلى
<meter min="200" max="500" value="350">350 درجة مئوية</meter>.</p>
مثال عن استخدام العنصر <meter> لتمثيل درجة ...
العنصر
يُحدِّد العنصر <source> عدِّة مصادر لملفات الوسائط المتعددة ضمن العنصر <picture> أو <audio> أو <video>. وهذا العنصر فارغ، وأكثر استخدام شائع له هو توفير محتوى الوسائط المتعددة نفسه لكن بصيغ مختلفة لكي يستطيع المتصفح تشغيل أنسبها. يشرح هذا المثال كيفية توفير مقطع فيديو بصيغة webm لمن يدعم متصفحه فيديو WebM، وتوفير المقطع بصيغة MP4 للمستخدمين الذين يدعم متصفحهم هذه الصيغة. إن لم يكن العنصر <audio> أو <video> مدعومًا من المتصفح فستظهر رسالة تنبه المستخدم إلى ذلك؛ وإن لم يكن المتصفح ...
حالة المكونات في React
ماذا يفعل التابع setState؟ يُجدوِل التابع setState() تحديثًا لكائن حالة المكوّن state. عندما تتغير الحالة يستجب المكوّن بإعادة التصيير. ما الفرق بين الحالة state والخاصيّات props؟ الخاصيّات props (اختصارًا للكلمة properties) والحالة state كلاهما عبارة عن كائنات JavaScript مجرّدة. وفي حين أنّ كلاهما يحمل معلومات تؤثر في ناتج التصيير، فهما مختلفان بطريقة واحدة هامة، حيث تُمرَّر الخاصيّات إلى المكوّن (بشكل مماثل لمُعاملات الدالة) بينما تُدار الحالة state ضمن المكوّن (بشكل مشابه للمتغيرات المعرفة بداخل الدالة). هنا تجد مصادر جيدة لقراءة ...
الخاصيات العامة
الخاصيات العامة هي الخاصية التي يمكن استعمالها في جميع عناصر HTML، على الرغم من أنَّها قد لا يكون لها تأثير إن استعملت على بعض العناصر. يمكن أن تستعمل الخاصيات العامة على جميع عناصر HTML حتى لو لم تكن هذه العناصر موجودةً في المعيار، وهذا يعني أنَّ العناصر غير المعيارية يجب أن تسمح باستخدام هذه الخاصية، حتى لو كان استخدام هذه العناصر سيؤدي إلى جعل المستند غير متوافق مع معيار HTML5. فمثلًا ستخفي المتصفحات التي تدعم HTML5 المحتوى الموجود ضمن العنصر ...
العنصر
يُمثِّل العنصر <ol> قائمةً مرتبةً من العناصر، التي تُعرَض على شكل قائمة مرقمة. مثال عن قائمة مرتبة <ol> فيها ثلاثة عناصر <li>: <ol>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ol>
بطاقة العنصر تصنيفات المحتوى محتوى تنظيمي. المحتوى المسموح عنصر <li> واحد أو أكثر، ويمكن لهذا العنصر أن يحتوي أيضًا على قوائم <ol> أو <ul> متشعبة داخله. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLOListElement دعم ...
العنصر
يُعرِّف العنصر <colgroup> مجموعة أعمدة ضمن أحد الجداول. لمشاهدة مثال عن استخدام العنصر <colgroup>، راجع صفحة العنصر <table> والعنصر <col>. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح إذا كانت الخاصية span مستخدمة، فلا يوجد فهو عنصرٌ فارغ. أما إذا لم تكن الخاصية موجودةً، فالعنصر <col> صفر مرة أو أكثر. الوسم المختصر يمكن حذف وسم البداية إذا كان أوّل أبناء هذا العنصر هو عنصر <col> ولم يُسبَق هذا العنصر بعنصر <colgroup> حُذِفَ وسم إغلاقه. يمكن حذف وسم الإغلاق إذا لم يُتبَع هذا ...
العنصر
يُعرِّف العنصر <col> عمودًا ضمن أحد الجداول، ويُستخدم لإعطاء هيكل تنظيمي للخلايا المتشابهة، ويكون موجودًا داخل عنصر <colgroup>. مثال عن جدول فيه مجموعة من الأعمدة (العنصر <colgroup>) وعرّفنا داخله عمودًا (العنصر <col>) لون خلفيته أخضر: <table>
<colgroup>
<col style="background-color: #0f0">
</colgroup>
<tr>
<th>التفاح</th>
<th>الليمون</th>
<th>البرتقال</th>
</tr>
<tr>
<td>أخضر</td>
<td>أصفر</td>
<td>برتقالي</td>
</tr>
</table>
بطاقة العنصر تصنيفات المحتوى ...
العنصر
يُعرِّف العنصر <tr> سطرًا يحتوي على خلايا في جدول، وهذه الخلايا تُمثَّل عبر العنصرين <td> و <th>. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. ...
Document.evaluate()
يُنشئ التّابع Document.evaluate() كائنًا من النّوع XPathResult مبني على تعبير XPath ومعاملات معطاة أخرى. البنية العامة var xpathResult = document.evaluate(
xpathExpression,
contextNode,
namespaceResolver,
resultType,
result
);
xpathExpression سلسة نصيّة تُمثّل تعبير XPath المرغوب تقديره (evaluate). contextNode يُحدّد عقدة السّياق للاستعلام (انظر مواصفة XPath). من الشّائع تمرير كائن المستند document كعقدة سياق. namespaceResolver دالّة تُمرَّر لها سابقات مجالات الأسماء (namespace prefixes) لتُعيد سلسلةً نصيّة تُمثّل عنوان URI مجال الأسماء المرتبط بالسّابقة المُمرَّرة. ستُستعمل لحلّ السّابقات داخل تعبير XPath ...
العنصر
يُعرِّف العنصر <area> منطقةً في خريطة لصورة، ويمكن أن ترتبط تلك المنطقة (اختياريًا) مع رابط فائق. لا يمكن استخدام هذا العنصر إلا ضمن عنصر <map>. لمشاهدة مثال متكامل عن استخدام العنصر <area>، راجع صفحة العنصر <map>. بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي. المحتوى المسموح لا يوجد، فهو عنصرٌ فارغ. الوسم المختصر يجب أن يكون وسم البداية موجودًا، ويجب أن يُحذَف وسم النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي؛ لكن يجب أن يكون العنصر <area> متواجدًا ضمن ...
التابع .fadeToggle() في jQuery
.fadeToggle( [duration ] [, easing ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة أو يخفيها عن طريق تحريك درجة العتامة. .fadeToggle( [duration ] [, easing ] [, complete ] ) أُضيف مع الإصدار: 1.4.4. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. easing (القيمة الافتراضية: swing) سلسلة نصية من النوع String، تُشير إلى دالة التخفيف المستخدمة في عملية التحوّل. complete دالة على الشكل ...
العنصر
يُستعمَل العنصر <audio> لتضمين المحتوى الصوتي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب الملفات الصوتية لتشغيلها. المثال الآتي يستخدم العنصر <audio> مع الخاصية autoplay لتشغيل الصوت تلقائيًا مع تحديد رابط URL للملف المصدري عبر الخاصية src: <audio src="khamsat.mp3" autoplay>
لا يدعم متصفحك العنصر <code>audio</code>.
</audio>
أما المثال الآتي ففيه العنصر <audio> مع استخدام خاصية controls لإضافة أزرار للتحكم بالمقطع، وسيُحدَّد رابط URL للمقطع عبر العنصر <source>: ...
التابع .fadeIn() في jQuery
.fadeIn( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة عن طريق تحويلها إلى الإعتام (opaque، أي لن تصبح شفافةً) تدريجيًا. .fadeIn( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .fadeIn( options ) أُضيف مع الإصدار: 1.0. options ...
العنصر
يُعرِّف العنصر <th> خليةً تُمثِّل ترويسةً في الجدول الذي يحتويها. تُعرّف طبيعة هذه الترويسة عبر الخاصيتين scope و headers. مثال عن استخدام الخاصية scope لتحديد ما هي الخلايا التي تُمثِّلها ترويسة ما: <table>
<caption>معلومات التواصل</caption>
<tbody>
<tr>
<th scope="col">الاسم</th>
<th scope="col">رقم الهاتف</th>
<th scope="col">المدينة</th>
</tr>
<tr>
<th scope="row">الموظف 1</th>
...
تعليمات الشرطات المائلة الثلاث في TypeScript
مقدمة تعليمات الشرطات المائلة الثلاث (Triple-slash directives) هي تعليقات تكتب في سطر واحد تحتوي على وسم XML واحد. تُستخدَم محتويات التعليق كتعليمات (إرشادات) للمترجم. تكون تعليمات الشرطات المائلة الثلاث صالحةً فقط في أعلى الملفّ الذي تكون هذه التعليمات موجودة داخله. ويُمكن لهذه التعليمات أن تُسبَق فقط بتعليق في سطر واحد أو تعليق متعدّد الأسطر (multi-line comment)، ما يشمل تعليمات شرطات مائلة ثلاث أخرى. إذا وُجِدَت بعد جملة أو تصريح فستُعامَل على أنها تعليقات عادية في سطر واحد (regular single-line comments)، ...
العنصر
يُعرِّف العنصر <td> خليةً في الجدول الذي يحتويها. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح المحتوى التنظيمي. الوسم المختصر لا ...
العنصر
يُحدِّد العنصر <link> العلاقات بين المستند الحالي وبين مورد خارجي (external resource)؛ من استخدامات هذا الوسم تتضمن تعريف علاقة بين الصفحات للتنقل بينها، بيد أنَّ أكثر استخدامات هذا العنصر شيوعًا هو تضمين صفحات الأنماط. استخدام الشكل الآتي للعنصر <link> لتضمين صفحة أنماط في المستند: <link href="style.css" rel="stylesheet">
بطاقة العنصر تصنيفات المحتوى البيانات الوصفية المحتوى المسموح لا يوجد، فهذا العنصر فارغ. الوسم المختصر لمّا كان هذا العنصر فارغًا، فيجب توفير وسم البداية وحذف وسم النهاية. العناصر الأب أي عنصر يقبل وجود ...
العنصر
يُمثِّل العنصر <button> زرًا قابلًا للضغط. مثال عن استخدام العنصر <button>: <button name="button">اضغط هنا</button>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي وعنصر عادي، وعنصر تفاعلي ... المحتوى المسموح المحتوى العادي. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي. واجهة DOM HTMLButtonElement دعم المتصفحات Chrome Firefox Edge Safari Opera مدعوم مدعوم مدعوم مدعوم مدعوم الخاصيات يمكن استخدام الخاصيات العامة في هذا العنصر. autofoucs تسمح لنا هذه الخاصية المنطقية (Boolean) بتحدد أنَّنا نريد ...
العنصر
يُمثِّل العنصر <form> قسمًا في المستند الذي يحتوي على عناصر يستطيع المستخدم التفاعل معها لإرسال بيانات إلى خادوم الويب. مثال بسيط عن نموذج يُرسَل عبر الطريقة GET: <form action="" method="get">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال بسيط عن نموذج يُرسَل عبر الطريقة POST: <form action="" method="post">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال عن نموذج يبيّن استخدام العناصر <fieldset> و <legend> و <label>: <form action="" method="post">
<fieldset>
...
العنصر
يُستعمَل العنصر <video> لتضمين المحتوى المرئي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب صيغة لتشغيلها. مثال عن استخدام العنصر <video> لإضافة مقطع فيديو بصيغة WebM (عبر الخاصية src) بارتفاع 360، مع عرض عناصر التحكم (عبر الخاصية controls) وله صورة غلاف تُعرَض إلى أن يبدأ تشغيله (الخاصية poster)، وستُعرَض رسالة نصية تنوِّه المستخدم أنَّ متصفحه لا يدعم العنصر <video>: <video src="khamsat.webm" controls poster="khamsat-poster.jpg" height="360">
لا ...
التابع .slideDown() في jQuery
()slideDown. القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يُظهِر هذا التابع جميع العناصر المتطابقة مع حركة انسحابيَّة. .slideDown( [duration ] [, complete ] ) أضيف مع الإصدار 1.0. duration عدد أو سلسلة نصية تمثِّل كمية الوقت الذي ستستغرقه عملية تحريك العنصر، وقيمته الافتراضيَّة هي 400. complete دالةٌ من الشكل Function() وتُستدعَى مرةً وحدةً مع كل عنصر من العناصر المطابقة بعد اكتمال الحركة المطبَّقة عليه. .slideDown( options ) أضيف مع الإصدار: 1.0. Options كائن من النوع Object، وهو مجموعة من ...
التابع .toggle() في jQuery
.toggle( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يبدِّل هذا التابع حالة العناصر المُطابقة بين العرض و الإخفاء. .toggle( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .toggle( options ) أُضيف مع الإصدار: 1.0. options كائن من النوع Object، ويقدم مجموعة من ...
Document.getElementsByClassName()
يُعيد التّابع Document.getElementsByClassName() كائنًا مُشابهًا للمصفوفات يحتوي على جميع العناصر الأولاد التي تحمل نفس اسم الصّنف (class name) المُعطى. عند استدعائه على كائن المُستند، فسيُبحَثُ في كامل المُستند، ما يشمل العقدة الجذر. يُمكن كذلك استدعاء التّابع getElementsByClassName() على أي عنصر؛ وسيُعيد العناصر الأولاد للعنصر الجذر المُحدَّد ذات أسماء الأصناف المعطاة. البنية العامة var elements = document.getElementsByClassName(names);
// أو
var elements = rootElement.getElementsByClassName(names);
elements كائنٌ حيّ من النّوع HTMLCollection الذي يُمثّل مجموعة العناصِر التي وُجدت. names سلسلةٌ نصيّةٌ تُمثّل قائمة أسماء الأصناف المرغوب ...
Document.queryCommandSupported()
يشير التّابع Document.queryCommandSupported() إلى ما إذا كان أمر التّحرير المعطى مدعومًا من طرف المتصفّح أم لا. البنية العامة isSupported = document.queryCommandSupported(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أم لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مدعومًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandSupported("SelectAll");
if(flg) {
// نفّذ عمليّةً ما
}
ملاحظات يعيد الأمر 'paste' القيمة false في حالة لم يكن الأمر متاحًا إضافةً إلى حالة كون السكربت المستدعي ...
Document.fullscreenElement
تُعيد الخاصية Document.fullscreenElement القابلة للقراءة فقط العنصر Element الذي في وضع ملء الشاشة حاليًا ضمن عناصر المستند الحالي، أو تُعيد القيمة null في حالة لم يكن وضع ملء الشاشة مُفعلًا. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var element = document.fullscreenElement;
ستكون قيمة المتغيّر element هي إشارةٌ إلى العنصر الموجود في وضع ملء الشاشة حاليًا، أو القيمة null في حالة ...
Document.createCDATASection()
يُنشئُ التّابع Document.createCDATASection() عقدةَ قسم CDATA جديدةً ويُعيدها. البنية العامة CDATASectionNode = document.createCDATASection(data)
CDATASectionNode يُمثّل عقدةً من النّوع CDATASection. data سلسلةٌ نصيّة تحتوي على البيانات المرغوب إضافتها إلى قسم CDATA. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml")
var cdata = docu.createCDATASection('هنا عقدة البيانات');
docu.getElementsByTagName('xml')[0].appendChild(cdata);
alert(new XMLSerializer().serializeToString(docu));
// ستَعرضُ
// <xml><![CDATA[هنا عقدة البيانات]]></xml>
ملاحظات يعمل هذا مع مستندات XML فقط، ولا يعمل مع مستندات HTML (لأنّ مُستندات HTML لا تدعم أقسام CDATA)؛ مُحاولة استعمال التّابع مع مُستندات HTML سترمي الاستثناء NOT_SUPPORTED_ERR. سترمي كذلك الاستثناء NS_ERROR_DOM_INVALID_CHARACTER_ERR ...
Document.createExpression()
يُجمّع التّابع Document.createExpression() استعلام XPathExpression، والذي يُمكن استعماله بعد ذلك لإجراء تقديرات (evaluations) يُمكن تكرارها. البنية العامة xpathExpr = document.createExpression(xpathText, namespaceURLMapper);
xpathText سلسلة نصيّة تُمثّل تعبير XPath المرغوب تجميعه. namespaceURLMapper دالّة تربط سابقة مجال أسماءٍ (namespace prefix) برابط URL مجال أسماءٍ أو القيمة null إن لم يكن ذلك مطلوبًا. القيمة المعادة كائنٌ من النّوع XPathExpression.
Document.onfullscreenchange
الخاصيّة Document.onfullscreenchange مُعالِج أحداثٍ للحدث fullscreenchange الذي يُطلَق عندما يلِج أو يخرج مُستندٌ من وضع ملء الشّاشة. البنية العامة targetDocument.onfullscreenchange = fullscreenChangeHandler;
مثال document.onfullscreenchange = function ( event ) {
console.log("هناك تغيّر في وضع ملء الشّاشة")
};
document.documentElement.onclick = function () {
// يجب استدعاء التّابع
// requestFullscreen()
// داخل مُعالج أحداث لكي لا يفشَل استدعاؤه
document.documentElement.requestFullscreen();
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي 45 47 وراء full-screen-api.unprefix.enabled ؟ ؟ ؟ ...
Document.location
تُعيد الخاصيّة Document.location القابلة للقِراءة فقط كائنًا من النّوع Location، والذي يحتوي على معلومات حول عنوان URL الخاصّ بالمُستند ويُتيح توابع لتعديل عنوان URL هذا وتحميل عنوان URL آخر. ورغم أنّ الخاصيّة Document.location للقِراءة فقط، إلا أنّك تستطيع تعيين سلسلة نصيّة من النّوع DOMString لها كذلك. ما يعني بأنّك تستطيع التّعامل مع هذه الخاصيّة بصفتها سلسلة نصيّة عاديّة في مُعظم الحالات. والسّطران التّاليّان مُتكافئان: document.location = 'http://www.example.com'
document.location.href = 'http://www.example.com'
للحصول على عنوان URL المُستندِ وحده، يُمكنك استعمال الخاصيّة document.URL كذلك. ...
Document.createComment()
يُنشئُ التّابع Document.createComment() عقدةَ تعليق جديدةً ويُعيدها. البنية العامة CommentNode = document.createComment(data)
data سلسلةٌ نصيّة تحتوي على التعليق المرغوب إضافته. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml");
var comment = docu.createComment('هذا تعليق');
docu.getElementsByTagName('xml')[0].appendChild(comment);
alert(new XMLSerializer().serializeToString(docu));
// تعرض
// <xml><!--هذا تعليق--></xml>
مصادر ومواصفات مواصفة createComment
Document.queryCommandEnabled()
يشير التّابع Document.queryCommandEnabled() إلى ما إذا كان أمر التّحرير المعطى مفعّلًا من طرف المتصفّح أم لا. البنية العامة isEnabled = document.queryCommandEnabled(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أو لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مُفعّلًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandEnabled("SelectAll");
if(flg) {
document.execCommand("SelectAll", false, null); // الأمر مُفعّل، لذا نفّذه
}
ملاحظات بالنّسبة للأمران 'cut' و'copy' فإنّ التّابع يعيد القيمة true فقط إن استدعيَ في ...
Document.fullscreenEnabled
تُعيد الخاصية Document.fullscreenEnabled القابلة للقراءة فقط كائنًا من النوع Boolean يُشير إلى ما إذا كان وضع ملء الشاشة مُتاحًا أم لا. وضع ملء الشاشة مُتاح للصفحات التي لا تحتوي على إضافات ذات نوافِذَ في أي من مُستنداتها فقط، وفي حالة كانت جميع عناصر <iframe> التي تحوي المُستند ذات خاصيّة allowfullscreen مضبوطة. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var isFullscreenAvailable ...
Document.dir
الخاصيّة Document.dir خاصيّةٌ من النّوع DOMString تُمثّل اتّجاهيّة النّص في المُستند، إمّا من اليسار إلى اليمين (وهو الخيار الافتراضي) أو من اليمين إلى اليسار. القيَم المُمكنة هي 'rtl' أي من اليمين إلى اليسار، والقيمة 'ltr' التّي تعني من اليسار إلى اليمين. البنية العامة dirStr = document.dir;
document.dir = dirStr;
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم ؟ ؟ مصادر ومواصفات مواصفة HTML Living Standard.
Document.defaultView
في المُتصفحات، تُعيد الخاصيّة Document.defaultView الكائن window المُرتبط بالمستند، أو القيمة null إن لم يكن متوافرًا. البنية العامة var win = document.defaultView;
الخاصيّة قابلة للقراءة فقط. دعم المتصفحات الميزة Chrome Edge Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard. مواصفة HTML5.
Document.exitPointerLock()
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. يُحرّر التّابع Document.exitPointerLock() قفل مؤشّر الفأرة بشكل غير مُتزامنٍ حسب طلبٍ سابقٍ من Element.requestPointerLock. للتحقّق من نجاح أو فشل الطّلب، لابدّ من الاستماع للحدثين pointerlockchange وpointerlockerror. البنية العامة document.exitPointerLock();
دعم المتصفحات الميزة Chrome Edge Firefox Internet Explorer Opera Safari الدعم الأساسي نعم (قد تحتاج إلى السّابقة -webkit في إصدارات قديمة) نعم نعم، مع السّابقة -moz 50 دون سابقة ؟ ؟ ؟ انظر أيضًا Document.pointerLockElement Element.requestPointerLock مصادر ومواصفات ...
Document.head
تُعيد الخاصية document.head العنصر <head> الخاصّ بالمُستند الحالي. إن كان للمُستند أكثر من عنصر <head> واحد، فالقيمة المُعادة ستُمثّل العنصر الأول. البنية العامة var objRef = document.head;
مثال // نضع ما يلي
// في ملفّ
// HTML
// <head id="my-document-head">
var aHead = document.head;
alert(aHead.id); // "my-document-head";
alert( document.head === document.querySelector("head") ); // true
ملاحظات الخاصيّة document.head للقِراءة فقط. مُحاولة ضبط قيمة لها سيفشَل دون أي أخطاء، أو سيرمي خطأ TypeError في مُتصفّح Firefox في حالة كان المستند في نمط strict. دعم المتصفحات الميزة Chrome Edge ...
Document.preferredStyleSheetSet
تُعيد مجموعة صفحات الأنماط المُفضّلة حسب ما ضبطه كاتب الصّفحة. وهي للقراءة فقط. البنية العامّة preferredStyleSheetSet = document.preferredStyleSheetSet
تُشير قيمة المتغيّر preferredStyleSheetSet إلى مجموعة صفحات الأنماط المُفضّلة من طرف كاتب الصّفحة. يُحدَّدُ هذا من خلال ترتيب تعريفات صفحات الأنماط وترويسة HTTP ذات العنوان Default-Style. إن لم تكن هناك مجموعة صفحات أنماط مُفضَّلة من طرف الكاتب، فستكون القيمة المُعادة سلسلةً نصية فارغة (""). مثال if (document.preferredStyleSheetSet) {
console.log("مجموعة صفحات الأنماط المُفضّلة هي:" + document.preferredStyleSheetSet);
} else {
console.log("لا توجد صفحة ...
Document.onselectionchange
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. الخاصيّة Document.onselectionchange مُعالِج أحداثٍ للحدث selectionchange الذي يُطلَق عندما يتغيّر تظليل الكائن. البنية العامة obj.onselectionchange = function;
المُتغيّر function هي دالّة عرّفها المُستخدم user-defined، دون اللاحقة () أو أية مُعاملات، أو تعريفٌ لدالّةٍ مجهولة (anonymous function). مثال document.onselectionchange = function() { console.log("لقد تغيّر التّظليل"); };
دعم المتصفحات الميزة Chrome Internet Explorer Edge Firefox Opera Safari الدعم الأساسي 49 ؟ نعم 45 ؟ ؟ انظر أيضًا selectionchange selectstart ...
Document.timeline
تنبيه: هذه تقنيّة تجريبيّة، انظر جدول دعم المُتصفحات قبل استعمال هذه الخاصيّة في شيفرة إنتاجيّة. تُعيد الخاصيّة القابلة للقراءة فقط timeline المُعرَّفة على الواجهة Document الخطَّ الزمني الافتراضي للمُستند الحالي. هذا الخط الزّمني كائن خاص من النوع DocumentTimeline الذي يُنشأ تلقائيا عند تحميل الصّفحة. الخطّ الزمني فريد لكل مستند ويبقى طيلة مُدّة بقاء المُستند حيًّا، ما يشمل استدعاءات التّابع document.open(). تُحسب القيم الزمنية لهذا الخط الزمني حسب حدّ ثابت (fixed offset) من السّاعة العموميّة بحيث يُكافئ وقتُ الصّفر (zero time) ...
Document.write()
يكتب التّابع Document.write() سلسلةً نصيّةً إلى مجرى (stream) مستندٍ فُتح بالتّابع window.open(). مُلاحظة: لأنّ التّابع Document.write() يكتب إلى مجرى المستند، فاستدعاؤه على مستندٍ مُغلقٍ (مُحمَّل) يستدعي تلقائيًّا التّابع Document.open()، الذي سيحذف محتويات المستند. البنية العامة document.write(markup);
markup سلسلة نصيّة تحتوي على النّص المرغوب كتابته على المستند. مثال <!DOCTYPE html>
<html>
<head>
<title>write مثال</title>
<script>
function newContent() {
alert("تحميل محتوى جديد");
document.open();
document.write("<h1>المحتوى ...
Document.visibilityState
تُعيد الخاصيّة Document.visibilityState القابلة للقراءة فقط حالةَ ظهور المُستند، أي سياق وضوح العنصر الحالي. إذ من المُفيد معرفة ما إذا كان المُستند في الخلفيّة أو في تبويب (لسان، tab) غير مرئي حاليًّا، أو أنّ الصّفحة قد حُمّلت فقط من أجل ما قبل التّصيير (pre-rendering). القيم المُمكنة هي كما يلي: 'visible': تُشير إلى أنّ مُحتويات الصّفحة قد تكون ظاهرة ولو جزئيّا. هذا يعني بأنّ الصفحة موجودة على تبويب أمامي في نافذة غيرِ مُصغّرة. 'hidden': مُحتويات الصّفحة غير واضحة للمستخدم. هذا يعني ...
Document.execCommand()
عندما ينتقل مستند HTML إلى نمط التّصميم designMode فإنّ كائن المستند يوفّر التّابع Document.execCommand() الذي يسمح للمستخدم بتنفيذ الأوامر للتعامل مع محتويات المنطقة القابلة للتّعديل. تؤثّر معظم هذه الأوامر على محتويات المستند الموجودة (تعديل النصوص لجعلها بخط عريض أو مائل مثلًا)، فيما تُدخِل بعض الأوامر الأخرى عناصر جديدة (مثل إضافة رابط) أو تؤثّر على كامل السّطر (مثل إزاحته). عند استخدام الخاصيّة contentEditable، فاستدعاء التّابع Document.execCommand() يؤثّر على العنصر المُفعّل القابل للتعديل حاليًّا. البنية العامة bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)
القيمة ...
Document.enableStyleSheetsForSet()
يفعّل التّابع Document.enableStyleSheetsForSet() صفحات الأنماط التي توافق الاسم المُحدّد في مجموعة صفحات الأنماط الحاليّة، ويُعطّل جميع صفحات الأنماط الأخرى (عَدا تلك التي بدون عنوان، والتي تكون دائمًا مُفعّلة). البنية العامة document.enableStyleSheetsForSet(name)
name اسم صفحات الأنماط المرغوب تفعيلها. ستُفعّل جميع صفحات الأنماط التي توافق هذا الاسم، لكن ستُعطَّل جميع صفحات الأنماط الأخرى التي تملك عنوانًا. مرّر سلسلةً نصيّةً فارغةً لهذا المُعامل لتعطيل جميع صفحات الأنماط البديلة والمُفضّلة (دون صفحات الأنماط الدّائمة التي لا تملك خاصّية title). ملاحظات تُوافَقُ العناوين يكون حسّاسًا ...
Document.hasFocus()
يُعيد التّابع Document.hasFocus() قيمة منطقيّة من النّوع Boolean تدلّ على ما إذا كان المستند أو أي عنصرٍ داخل المستند مُركَّزًا عليه أو لا. يُستعمل هذا التّابع لتحديد ما إذا كان العنصر المفعّل في مستند مُركَّزًا عليه أو لا. ملاحظة: عند عرض مستندٍ ما، فالعنصر المُركّز عليه هو دائمًا العنصر المفعّل في المستند، لكنّ العنصر المفعّل لا يكون دائمًا مُركَّزًا عليه بالضّرورة. على سبيل المثال، عنصر مُفعّل داخل نافذة منبثقة في الخلفيّة لا يكون مركّزًا عليه. البنية العامة focused = document.hasFocus();
...
Document.hidden
تُعيد الخاصيّة Document.hidden قيمة منطقيّة تُشير إلى ما إذا كانت الصّفحة مخفية أم لا. لاحظ أنّ هذه الخاصّية قابلة للقراءة فقط. البنية العامّة var boolean = document.hidden
مثال document.addEventListener("visibilitychange", function() {
console.log( document.hidden );
// افعل شيئا ما
});
دعم المتصفحات الميزة Chrome Firefox Internet Explorer Opera Safari الدعم الأساسي 13 مع السابقة -webkit- ، 33 دون سابقة. 18 10 12.10 7 مصادر ومواصفات مواصفة Page Visibility (Second Edition).
Document.querySelector()
يُعيد التّابع Document.querySelector() أول كائنٍ من النّوع Element الذي يُمثّل العنصر المُوافِق للمُحدِّد أو المحدّدات المعطاة. ويُعيد القيمة null في حالة لم يجِد أيّ عنصر. مُلاحظة: يتمّ البحث باستعمال المرور على العمق أولًا قبل التّرتيب (depth-first pre-order traversal) حول عقد المستند بدايةً من أول عنصر في هيكل المستند ويُكرّر (iterating) حول العقد في القائمة مرتّبةً حسب عدد العقد الأبناء. البنية العامة element = document.querySelector(selectors);
selectors سلسلة نصيّة من النّوع DOMString تحتوي على مُحدّد واحدٍ أو أكثر لمُوافقته مع عناصر المستند ...
Document.scripts
خاصيّة قابلة للقراءة فقط تُعيد جميع عناصر <script> في المُستند. والقيمة المُعادة كائنٌ من النّوع HTMLCollection. البنية العامة var scriptList = document.scripts;
القيمة المُعادة كائنٌ من النّوع HTMLCollection. يُمكنك التّعامل مع المُتغيّر scriptList كما تتعامل مع أي مصفوفة للوصول إلى جميع العناصر في القائمة. مثال المثال التّالي يتحقّق ممّا إذا كان للصّفحة الحاليّة أي عنصر <script>: var scripts = document.scripts;
if (scripts.length) {
alert("هذه الصّفحة تحتوي على سكربتات");
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم ...
Document.writeln()
يكتب التّابع Document.writeln() سلسلةً نصيّةً متبوعةً بمحرف سطرٍ جديدٍ (newline character) على المستند. البنية العامة document.writeln(line);
line سلسلة نصيّة تحتوي على سطر النّص المرغوب إضافته. مثال document.writeln("<p>أدخل كلمة المرور</p>");
ملاحظات التّابع Document.writeln() مشابه للتّابع Document.write() لكنّه يُضيف سطرًا جديدًا. كما هو الحال مع التّابع Document.write() فالتّابع Document.writeln() لا يعمل كذلك في مستندات XHTML، وستحصل على خطأ NS_ERROR_DOM_NOT_SUPPORTED_ERR يفيد بأنّ العمليّة غير مدعومة في سطر أوامر الأخطاء. يحدث هذا عن محاولة فتح ملفّ محليّ ذو الامتداد .xhtml أو أي مستندٍ مُقدَّمٍ ...
Document.plugins
تُعيد الخاصيّة Document.plugins مجموعةً من النّوع HTMLCollection تحتوي على قائمة بجميع عناصر <embed> الموجودة في المُستند الحاليّ. كلّ عنصر في المجموعة يُعدّ من النّوع HTMLEmbedElement، يُمكن أن يكون عدد العناصِر واحدًا أو أكثر، وفي حالة لم يوجَد أي عنصر، فستُعاد القيمة null. مُلاحظة: للحصول على قائمة بالإضافات (plugins) المُنصَّبة، استعمل الخاصيّة NavigatorPlugins.plugins. البنية العامة embedArrayObj = document.plugins
مصادر ومواصفات مواصفة HTML Living Standard
Document.embeds
تُعيد الخاصّية embeds قائمةً بالكائنات المُضمّنة داخل المُستند الحالي. البنية العامة nodeList = document.embeds
مصادر ومواصفات مواصفة HTML Living Standard.
Document.lastModified
تُعيد الخاصية document.lastModified سلسلةً نصيةً تحتوي على تاريخ ووقتِ آخر تعديلٍ للمُستند الحاليّ. البنية العامة string = document.lastModified;
مثال طريقة الاستعمال البسيطة: alert(document.lastModified);
// يُعيد تاريخا مُشابها لما يلي
// 03/22/2018 05:20:48
تحويل قيمة lastModified إلى كائن من النّوع Date: var oLastModif = new Date(document.lastModified);
تحويل قيمة lastModified إلى عدد الأجزاء من ألف جزء من الثّانيّة التّي مرّت منذ 1 يناير 1970 على السّاعة 00:00:00: var nLastModif = Date.parse(document.lastModified);
ملاحظات لاحظ بأنّه لا يُمكن استعمال السّلسة النّصيّة التي تُعيدها الخاصيّة lastModified ...
Document.selectedStyleSheetSet
تُعيد اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا. البنية العامة currentStyleSheetSet = document.selectedStyleSheetSet
document.selectedStyleSheet = newStyleSheetSet
عند الإعادة، سيحمل المتغيّر currentStyleSheetSet اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا، يُمكنك كذلك ضبط مجموعة صفحات الأنماط باستعمال هذه الخاصيّة. ضبط قيمة لهذه الخاصيّة مُكافئٌ لاستدعاء التّابع document.enableStyleSheetsForSet() باستخدام القيمة currentStyleSheetSet، ثمّ ضبط نفس القيمة للخاصية lastStyleSheetSet أيضًا. مُلاحظة: قيمة هذه الخاصيّة حيّة؛ تغيير الخاصيّة disabled على صفحات الأنماط سيُؤثّر على قيمة هذه الخاصيّة. مثال console.log("مجموعة صفحات الأنماط الجاري استعمالها حاليًّا:" + document.selectedStyleSheetSet);
document.selectedStyleSheetSet = ...
Document.designMode
تُستعمل الخاصيّة Document.designMode للتّحكّم فيما إذا أمكن تعديل كامِلِ المُستند أو لا. القيَم الصّالحة هي "on" و"off". وحسب المُواصفة، فالقيمة الافتراضيّة لهذه الخاصّية هي "off"، لكنّ القيمة تكون بأحرفٍ كبيرة (capitalized) في مُتصفّح Internet Explorer. البنية العامة var mode = document.designMode;
document.designMode = "on";
document.designMode = "off";
مثال جعْلُ مُستندِ عنصرِ <iframe> قابلًا للتّعديل: iframeNode.contentDocument.designMode = "on";
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard.
عرض (250 السابقة | 250 التالية) (20 | 50 | 100 | 250 | 500).
العنصر
يُمثِّل العنصر <meter> إما قيمةً عددية ضمن مجال معيّن، أو قيمةً جزئية (fractional value). مثال بسيط عن استخدام العنصر <meter> لعرض درجة الحرارة التي يجب ضبط الفرن عليها لطهي نوع معيّن من الطعام، لاحظ استخدام الخاصية min لتحديد أدنى قيمة (أقل درجة حرارة متاحة في الفرن) والخاصية max لتحديد أكبر قيمة (أكبر درجة حرارة يمكن تسخين الفرن إليها) والخاصية value لتحديد درجة الحرارة المطلوبة: <p>سخِّن الفرن إلى
<meter min="200" max="500" value="350">350 درجة مئوية</meter>.</p>
مثال عن استخدام العنصر <meter> لتمثيل درجة ...
العنصر
يُحدِّد العنصر <source> عدِّة مصادر لملفات الوسائط المتعددة ضمن العنصر <picture> أو <audio> أو <video>. وهذا العنصر فارغ، وأكثر استخدام شائع له هو توفير محتوى الوسائط المتعددة نفسه لكن بصيغ مختلفة لكي يستطيع المتصفح تشغيل أنسبها. يشرح هذا المثال كيفية توفير مقطع فيديو بصيغة webm لمن يدعم متصفحه فيديو WebM، وتوفير المقطع بصيغة MP4 للمستخدمين الذين يدعم متصفحهم هذه الصيغة. إن لم يكن العنصر <audio> أو <video> مدعومًا من المتصفح فستظهر رسالة تنبه المستخدم إلى ذلك؛ وإن لم يكن المتصفح ...
حالة المكونات في React
ماذا يفعل التابع setState؟ يُجدوِل التابع setState() تحديثًا لكائن حالة المكوّن state. عندما تتغير الحالة يستجب المكوّن بإعادة التصيير. ما الفرق بين الحالة state والخاصيّات props؟ الخاصيّات props (اختصارًا للكلمة properties) والحالة state كلاهما عبارة عن كائنات JavaScript مجرّدة. وفي حين أنّ كلاهما يحمل معلومات تؤثر في ناتج التصيير، فهما مختلفان بطريقة واحدة هامة، حيث تُمرَّر الخاصيّات إلى المكوّن (بشكل مماثل لمُعاملات الدالة) بينما تُدار الحالة state ضمن المكوّن (بشكل مشابه للمتغيرات المعرفة بداخل الدالة). هنا تجد مصادر جيدة لقراءة ...
الخاصيات العامة
الخاصيات العامة هي الخاصية التي يمكن استعمالها في جميع عناصر HTML، على الرغم من أنَّها قد لا يكون لها تأثير إن استعملت على بعض العناصر. يمكن أن تستعمل الخاصيات العامة على جميع عناصر HTML حتى لو لم تكن هذه العناصر موجودةً في المعيار، وهذا يعني أنَّ العناصر غير المعيارية يجب أن تسمح باستخدام هذه الخاصية، حتى لو كان استخدام هذه العناصر سيؤدي إلى جعل المستند غير متوافق مع معيار HTML5. فمثلًا ستخفي المتصفحات التي تدعم HTML5 المحتوى الموجود ضمن العنصر ...
العنصر
يُمثِّل العنصر <ol> قائمةً مرتبةً من العناصر، التي تُعرَض على شكل قائمة مرقمة. مثال عن قائمة مرتبة <ol> فيها ثلاثة عناصر <li>: <ol>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li>العنصر الثالث</li>
</ol>
بطاقة العنصر تصنيفات المحتوى محتوى تنظيمي. المحتوى المسموح عنصر <li> واحد أو أكثر، ويمكن لهذا العنصر أن يحتوي أيضًا على قوائم <ol> أو <ul> متشعبة داخله. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى التنظيمي. واجهة DOM HTMLOListElement دعم ...
العنصر
يُعرِّف العنصر <colgroup> مجموعة أعمدة ضمن أحد الجداول. لمشاهدة مثال عن استخدام العنصر <colgroup>، راجع صفحة العنصر <table> والعنصر <col>. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح إذا كانت الخاصية span مستخدمة، فلا يوجد فهو عنصرٌ فارغ. أما إذا لم تكن الخاصية موجودةً، فالعنصر <col> صفر مرة أو أكثر. الوسم المختصر يمكن حذف وسم البداية إذا كان أوّل أبناء هذا العنصر هو عنصر <col> ولم يُسبَق هذا العنصر بعنصر <colgroup> حُذِفَ وسم إغلاقه. يمكن حذف وسم الإغلاق إذا لم يُتبَع هذا ...
العنصر
يُعرِّف العنصر <col> عمودًا ضمن أحد الجداول، ويُستخدم لإعطاء هيكل تنظيمي للخلايا المتشابهة، ويكون موجودًا داخل عنصر <colgroup>. مثال عن جدول فيه مجموعة من الأعمدة (العنصر <colgroup>) وعرّفنا داخله عمودًا (العنصر <col>) لون خلفيته أخضر: <table>
<colgroup>
<col style="background-color: #0f0">
</colgroup>
<tr>
<th>التفاح</th>
<th>الليمون</th>
<th>البرتقال</th>
</tr>
<tr>
<td>أخضر</td>
<td>أصفر</td>
<td>برتقالي</td>
</tr>
</table>
بطاقة العنصر تصنيفات المحتوى ...
العنصر
يُعرِّف العنصر <tr> سطرًا يحتوي على خلايا في جدول، وهذه الخلايا تُمثَّل عبر العنصرين <td> و <th>. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. ...
Document.evaluate()
يُنشئ التّابع Document.evaluate() كائنًا من النّوع XPathResult مبني على تعبير XPath ومعاملات معطاة أخرى. البنية العامة var xpathResult = document.evaluate(
xpathExpression,
contextNode,
namespaceResolver,
resultType,
result
);
xpathExpression سلسة نصيّة تُمثّل تعبير XPath المرغوب تقديره (evaluate). contextNode يُحدّد عقدة السّياق للاستعلام (انظر مواصفة XPath). من الشّائع تمرير كائن المستند document كعقدة سياق. namespaceResolver دالّة تُمرَّر لها سابقات مجالات الأسماء (namespace prefixes) لتُعيد سلسلةً نصيّة تُمثّل عنوان URI مجال الأسماء المرتبط بالسّابقة المُمرَّرة. ستُستعمل لحلّ السّابقات داخل تعبير XPath ...
العنصر
يُعرِّف العنصر <area> منطقةً في خريطة لصورة، ويمكن أن ترتبط تلك المنطقة (اختياريًا) مع رابط فائق. لا يمكن استخدام هذا العنصر إلا ضمن عنصر <map>. لمشاهدة مثال متكامل عن استخدام العنصر <area>، راجع صفحة العنصر <map>. بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي. المحتوى المسموح لا يوجد، فهو عنصرٌ فارغ. الوسم المختصر يجب أن يكون وسم البداية موجودًا، ويجب أن يُحذَف وسم النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي؛ لكن يجب أن يكون العنصر <area> متواجدًا ضمن ...
التابع .fadeToggle() في jQuery
.fadeToggle( [duration ] [, easing ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة أو يخفيها عن طريق تحريك درجة العتامة. .fadeToggle( [duration ] [, easing ] [, complete ] ) أُضيف مع الإصدار: 1.4.4. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. easing (القيمة الافتراضية: swing) سلسلة نصية من النوع String، تُشير إلى دالة التخفيف المستخدمة في عملية التحوّل. complete دالة على الشكل ...
العنصر
يُستعمَل العنصر <audio> لتضمين المحتوى الصوتي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب الملفات الصوتية لتشغيلها. المثال الآتي يستخدم العنصر <audio> مع الخاصية autoplay لتشغيل الصوت تلقائيًا مع تحديد رابط URL للملف المصدري عبر الخاصية src: <audio src="khamsat.mp3" autoplay>
لا يدعم متصفحك العنصر <code>audio</code>.
</audio>
أما المثال الآتي ففيه العنصر <audio> مع استخدام خاصية controls لإضافة أزرار للتحكم بالمقطع، وسيُحدَّد رابط URL للمقطع عبر العنصر <source>: ...
التابع .fadeIn() في jQuery
.fadeIn( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة عن طريق تحويلها إلى الإعتام (opaque، أي لن تصبح شفافةً) تدريجيًا. .fadeIn( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .fadeIn( options ) أُضيف مع الإصدار: 1.0. options ...
العنصر
يُعرِّف العنصر <th> خليةً تُمثِّل ترويسةً في الجدول الذي يحتويها. تُعرّف طبيعة هذه الترويسة عبر الخاصيتين scope و headers. مثال عن استخدام الخاصية scope لتحديد ما هي الخلايا التي تُمثِّلها ترويسة ما: <table>
<caption>معلومات التواصل</caption>
<tbody>
<tr>
<th scope="col">الاسم</th>
<th scope="col">رقم الهاتف</th>
<th scope="col">المدينة</th>
</tr>
<tr>
<th scope="row">الموظف 1</th>
...
تعليمات الشرطات المائلة الثلاث في TypeScript
مقدمة تعليمات الشرطات المائلة الثلاث (Triple-slash directives) هي تعليقات تكتب في سطر واحد تحتوي على وسم XML واحد. تُستخدَم محتويات التعليق كتعليمات (إرشادات) للمترجم. تكون تعليمات الشرطات المائلة الثلاث صالحةً فقط في أعلى الملفّ الذي تكون هذه التعليمات موجودة داخله. ويُمكن لهذه التعليمات أن تُسبَق فقط بتعليق في سطر واحد أو تعليق متعدّد الأسطر (multi-line comment)، ما يشمل تعليمات شرطات مائلة ثلاث أخرى. إذا وُجِدَت بعد جملة أو تصريح فستُعامَل على أنها تعليقات عادية في سطر واحد (regular single-line comments)، ...
العنصر
يُعرِّف العنصر <td> خليةً في الجدول الذي يحتويها. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح المحتوى التنظيمي. الوسم المختصر لا ...
العنصر
يُحدِّد العنصر <link> العلاقات بين المستند الحالي وبين مورد خارجي (external resource)؛ من استخدامات هذا الوسم تتضمن تعريف علاقة بين الصفحات للتنقل بينها، بيد أنَّ أكثر استخدامات هذا العنصر شيوعًا هو تضمين صفحات الأنماط. استخدام الشكل الآتي للعنصر <link> لتضمين صفحة أنماط في المستند: <link href="style.css" rel="stylesheet">
بطاقة العنصر تصنيفات المحتوى البيانات الوصفية المحتوى المسموح لا يوجد، فهذا العنصر فارغ. الوسم المختصر لمّا كان هذا العنصر فارغًا، فيجب توفير وسم البداية وحذف وسم النهاية. العناصر الأب أي عنصر يقبل وجود ...
العنصر
يُمثِّل العنصر <button> زرًا قابلًا للضغط. مثال عن استخدام العنصر <button>: <button name="button">اضغط هنا</button>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي وعنصر عادي، وعنصر تفاعلي ... المحتوى المسموح المحتوى العادي. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي. واجهة DOM HTMLButtonElement دعم المتصفحات Chrome Firefox Edge Safari Opera مدعوم مدعوم مدعوم مدعوم مدعوم الخاصيات يمكن استخدام الخاصيات العامة في هذا العنصر. autofoucs تسمح لنا هذه الخاصية المنطقية (Boolean) بتحدد أنَّنا نريد ...
العنصر
يُمثِّل العنصر <form> قسمًا في المستند الذي يحتوي على عناصر يستطيع المستخدم التفاعل معها لإرسال بيانات إلى خادوم الويب. مثال بسيط عن نموذج يُرسَل عبر الطريقة GET: <form action="" method="get">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال بسيط عن نموذج يُرسَل عبر الطريقة POST: <form action="" method="post">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال عن نموذج يبيّن استخدام العناصر <fieldset> و <legend> و <label>: <form action="" method="post">
<fieldset>
...
العنصر
يُستعمَل العنصر <video> لتضمين المحتوى المرئي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب صيغة لتشغيلها. مثال عن استخدام العنصر <video> لإضافة مقطع فيديو بصيغة WebM (عبر الخاصية src) بارتفاع 360، مع عرض عناصر التحكم (عبر الخاصية controls) وله صورة غلاف تُعرَض إلى أن يبدأ تشغيله (الخاصية poster)، وستُعرَض رسالة نصية تنوِّه المستخدم أنَّ متصفحه لا يدعم العنصر <video>: <video src="khamsat.webm" controls poster="khamsat-poster.jpg" height="360">
لا ...
التابع .slideDown() في jQuery
()slideDown. القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يُظهِر هذا التابع جميع العناصر المتطابقة مع حركة انسحابيَّة. .slideDown( [duration ] [, complete ] ) أضيف مع الإصدار 1.0. duration عدد أو سلسلة نصية تمثِّل كمية الوقت الذي ستستغرقه عملية تحريك العنصر، وقيمته الافتراضيَّة هي 400. complete دالةٌ من الشكل Function() وتُستدعَى مرةً وحدةً مع كل عنصر من العناصر المطابقة بعد اكتمال الحركة المطبَّقة عليه. .slideDown( options ) أضيف مع الإصدار: 1.0. Options كائن من النوع Object، وهو مجموعة من ...
التابع .toggle() في jQuery
.toggle( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يبدِّل هذا التابع حالة العناصر المُطابقة بين العرض و الإخفاء. .toggle( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .toggle( options ) أُضيف مع الإصدار: 1.0. options كائن من النوع Object، ويقدم مجموعة من ...
Document.getElementsByClassName()
يُعيد التّابع Document.getElementsByClassName() كائنًا مُشابهًا للمصفوفات يحتوي على جميع العناصر الأولاد التي تحمل نفس اسم الصّنف (class name) المُعطى. عند استدعائه على كائن المُستند، فسيُبحَثُ في كامل المُستند، ما يشمل العقدة الجذر. يُمكن كذلك استدعاء التّابع getElementsByClassName() على أي عنصر؛ وسيُعيد العناصر الأولاد للعنصر الجذر المُحدَّد ذات أسماء الأصناف المعطاة. البنية العامة var elements = document.getElementsByClassName(names);
// أو
var elements = rootElement.getElementsByClassName(names);
elements كائنٌ حيّ من النّوع HTMLCollection الذي يُمثّل مجموعة العناصِر التي وُجدت. names سلسلةٌ نصيّةٌ تُمثّل قائمة أسماء الأصناف المرغوب ...
Document.queryCommandSupported()
يشير التّابع Document.queryCommandSupported() إلى ما إذا كان أمر التّحرير المعطى مدعومًا من طرف المتصفّح أم لا. البنية العامة isSupported = document.queryCommandSupported(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أم لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مدعومًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandSupported("SelectAll");
if(flg) {
// نفّذ عمليّةً ما
}
ملاحظات يعيد الأمر 'paste' القيمة false في حالة لم يكن الأمر متاحًا إضافةً إلى حالة كون السكربت المستدعي ...
Document.fullscreenElement
تُعيد الخاصية Document.fullscreenElement القابلة للقراءة فقط العنصر Element الذي في وضع ملء الشاشة حاليًا ضمن عناصر المستند الحالي، أو تُعيد القيمة null في حالة لم يكن وضع ملء الشاشة مُفعلًا. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var element = document.fullscreenElement;
ستكون قيمة المتغيّر element هي إشارةٌ إلى العنصر الموجود في وضع ملء الشاشة حاليًا، أو القيمة null في حالة ...
Document.createCDATASection()
يُنشئُ التّابع Document.createCDATASection() عقدةَ قسم CDATA جديدةً ويُعيدها. البنية العامة CDATASectionNode = document.createCDATASection(data)
CDATASectionNode يُمثّل عقدةً من النّوع CDATASection. data سلسلةٌ نصيّة تحتوي على البيانات المرغوب إضافتها إلى قسم CDATA. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml")
var cdata = docu.createCDATASection('هنا عقدة البيانات');
docu.getElementsByTagName('xml')[0].appendChild(cdata);
alert(new XMLSerializer().serializeToString(docu));
// ستَعرضُ
// <xml><![CDATA[هنا عقدة البيانات]]></xml>
ملاحظات يعمل هذا مع مستندات XML فقط، ولا يعمل مع مستندات HTML (لأنّ مُستندات HTML لا تدعم أقسام CDATA)؛ مُحاولة استعمال التّابع مع مُستندات HTML سترمي الاستثناء NOT_SUPPORTED_ERR. سترمي كذلك الاستثناء NS_ERROR_DOM_INVALID_CHARACTER_ERR ...
Document.createExpression()
يُجمّع التّابع Document.createExpression() استعلام XPathExpression، والذي يُمكن استعماله بعد ذلك لإجراء تقديرات (evaluations) يُمكن تكرارها. البنية العامة xpathExpr = document.createExpression(xpathText, namespaceURLMapper);
xpathText سلسلة نصيّة تُمثّل تعبير XPath المرغوب تجميعه. namespaceURLMapper دالّة تربط سابقة مجال أسماءٍ (namespace prefix) برابط URL مجال أسماءٍ أو القيمة null إن لم يكن ذلك مطلوبًا. القيمة المعادة كائنٌ من النّوع XPathExpression.
Document.onfullscreenchange
الخاصيّة Document.onfullscreenchange مُعالِج أحداثٍ للحدث fullscreenchange الذي يُطلَق عندما يلِج أو يخرج مُستندٌ من وضع ملء الشّاشة. البنية العامة targetDocument.onfullscreenchange = fullscreenChangeHandler;
مثال document.onfullscreenchange = function ( event ) {
console.log("هناك تغيّر في وضع ملء الشّاشة")
};
document.documentElement.onclick = function () {
// يجب استدعاء التّابع
// requestFullscreen()
// داخل مُعالج أحداث لكي لا يفشَل استدعاؤه
document.documentElement.requestFullscreen();
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي 45 47 وراء full-screen-api.unprefix.enabled ؟ ؟ ؟ ...
Document.location
تُعيد الخاصيّة Document.location القابلة للقِراءة فقط كائنًا من النّوع Location، والذي يحتوي على معلومات حول عنوان URL الخاصّ بالمُستند ويُتيح توابع لتعديل عنوان URL هذا وتحميل عنوان URL آخر. ورغم أنّ الخاصيّة Document.location للقِراءة فقط، إلا أنّك تستطيع تعيين سلسلة نصيّة من النّوع DOMString لها كذلك. ما يعني بأنّك تستطيع التّعامل مع هذه الخاصيّة بصفتها سلسلة نصيّة عاديّة في مُعظم الحالات. والسّطران التّاليّان مُتكافئان: document.location = 'http://www.example.com'
document.location.href = 'http://www.example.com'
للحصول على عنوان URL المُستندِ وحده، يُمكنك استعمال الخاصيّة document.URL كذلك. ...
Document.createComment()
يُنشئُ التّابع Document.createComment() عقدةَ تعليق جديدةً ويُعيدها. البنية العامة CommentNode = document.createComment(data)
data سلسلةٌ نصيّة تحتوي على التعليق المرغوب إضافته. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml");
var comment = docu.createComment('هذا تعليق');
docu.getElementsByTagName('xml')[0].appendChild(comment);
alert(new XMLSerializer().serializeToString(docu));
// تعرض
// <xml><!--هذا تعليق--></xml>
مصادر ومواصفات مواصفة createComment
Document.queryCommandEnabled()
يشير التّابع Document.queryCommandEnabled() إلى ما إذا كان أمر التّحرير المعطى مفعّلًا من طرف المتصفّح أم لا. البنية العامة isEnabled = document.queryCommandEnabled(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أو لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مُفعّلًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandEnabled("SelectAll");
if(flg) {
document.execCommand("SelectAll", false, null); // الأمر مُفعّل، لذا نفّذه
}
ملاحظات بالنّسبة للأمران 'cut' و'copy' فإنّ التّابع يعيد القيمة true فقط إن استدعيَ في ...
Document.fullscreenEnabled
تُعيد الخاصية Document.fullscreenEnabled القابلة للقراءة فقط كائنًا من النوع Boolean يُشير إلى ما إذا كان وضع ملء الشاشة مُتاحًا أم لا. وضع ملء الشاشة مُتاح للصفحات التي لا تحتوي على إضافات ذات نوافِذَ في أي من مُستنداتها فقط، وفي حالة كانت جميع عناصر <iframe> التي تحوي المُستند ذات خاصيّة allowfullscreen مضبوطة. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var isFullscreenAvailable ...
Document.dir
الخاصيّة Document.dir خاصيّةٌ من النّوع DOMString تُمثّل اتّجاهيّة النّص في المُستند، إمّا من اليسار إلى اليمين (وهو الخيار الافتراضي) أو من اليمين إلى اليسار. القيَم المُمكنة هي 'rtl' أي من اليمين إلى اليسار، والقيمة 'ltr' التّي تعني من اليسار إلى اليمين. البنية العامة dirStr = document.dir;
document.dir = dirStr;
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم ؟ ؟ مصادر ومواصفات مواصفة HTML Living Standard.
Document.defaultView
في المُتصفحات، تُعيد الخاصيّة Document.defaultView الكائن window المُرتبط بالمستند، أو القيمة null إن لم يكن متوافرًا. البنية العامة var win = document.defaultView;
الخاصيّة قابلة للقراءة فقط. دعم المتصفحات الميزة Chrome Edge Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard. مواصفة HTML5.
Document.exitPointerLock()
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. يُحرّر التّابع Document.exitPointerLock() قفل مؤشّر الفأرة بشكل غير مُتزامنٍ حسب طلبٍ سابقٍ من Element.requestPointerLock. للتحقّق من نجاح أو فشل الطّلب، لابدّ من الاستماع للحدثين pointerlockchange وpointerlockerror. البنية العامة document.exitPointerLock();
دعم المتصفحات الميزة Chrome Edge Firefox Internet Explorer Opera Safari الدعم الأساسي نعم (قد تحتاج إلى السّابقة -webkit في إصدارات قديمة) نعم نعم، مع السّابقة -moz 50 دون سابقة ؟ ؟ ؟ انظر أيضًا Document.pointerLockElement Element.requestPointerLock مصادر ومواصفات ...
Document.head
تُعيد الخاصية document.head العنصر <head> الخاصّ بالمُستند الحالي. إن كان للمُستند أكثر من عنصر <head> واحد، فالقيمة المُعادة ستُمثّل العنصر الأول. البنية العامة var objRef = document.head;
مثال // نضع ما يلي
// في ملفّ
// HTML
// <head id="my-document-head">
var aHead = document.head;
alert(aHead.id); // "my-document-head";
alert( document.head === document.querySelector("head") ); // true
ملاحظات الخاصيّة document.head للقِراءة فقط. مُحاولة ضبط قيمة لها سيفشَل دون أي أخطاء، أو سيرمي خطأ TypeError في مُتصفّح Firefox في حالة كان المستند في نمط strict. دعم المتصفحات الميزة Chrome Edge ...
Document.preferredStyleSheetSet
تُعيد مجموعة صفحات الأنماط المُفضّلة حسب ما ضبطه كاتب الصّفحة. وهي للقراءة فقط. البنية العامّة preferredStyleSheetSet = document.preferredStyleSheetSet
تُشير قيمة المتغيّر preferredStyleSheetSet إلى مجموعة صفحات الأنماط المُفضّلة من طرف كاتب الصّفحة. يُحدَّدُ هذا من خلال ترتيب تعريفات صفحات الأنماط وترويسة HTTP ذات العنوان Default-Style. إن لم تكن هناك مجموعة صفحات أنماط مُفضَّلة من طرف الكاتب، فستكون القيمة المُعادة سلسلةً نصية فارغة (""). مثال if (document.preferredStyleSheetSet) {
console.log("مجموعة صفحات الأنماط المُفضّلة هي:" + document.preferredStyleSheetSet);
} else {
console.log("لا توجد صفحة ...
Document.onselectionchange
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. الخاصيّة Document.onselectionchange مُعالِج أحداثٍ للحدث selectionchange الذي يُطلَق عندما يتغيّر تظليل الكائن. البنية العامة obj.onselectionchange = function;
المُتغيّر function هي دالّة عرّفها المُستخدم user-defined، دون اللاحقة () أو أية مُعاملات، أو تعريفٌ لدالّةٍ مجهولة (anonymous function). مثال document.onselectionchange = function() { console.log("لقد تغيّر التّظليل"); };
دعم المتصفحات الميزة Chrome Internet Explorer Edge Firefox Opera Safari الدعم الأساسي 49 ؟ نعم 45 ؟ ؟ انظر أيضًا selectionchange selectstart ...
Document.timeline
تنبيه: هذه تقنيّة تجريبيّة، انظر جدول دعم المُتصفحات قبل استعمال هذه الخاصيّة في شيفرة إنتاجيّة. تُعيد الخاصيّة القابلة للقراءة فقط timeline المُعرَّفة على الواجهة Document الخطَّ الزمني الافتراضي للمُستند الحالي. هذا الخط الزّمني كائن خاص من النوع DocumentTimeline الذي يُنشأ تلقائيا عند تحميل الصّفحة. الخطّ الزمني فريد لكل مستند ويبقى طيلة مُدّة بقاء المُستند حيًّا، ما يشمل استدعاءات التّابع document.open(). تُحسب القيم الزمنية لهذا الخط الزمني حسب حدّ ثابت (fixed offset) من السّاعة العموميّة بحيث يُكافئ وقتُ الصّفر (zero time) ...
Document.write()
يكتب التّابع Document.write() سلسلةً نصيّةً إلى مجرى (stream) مستندٍ فُتح بالتّابع window.open(). مُلاحظة: لأنّ التّابع Document.write() يكتب إلى مجرى المستند، فاستدعاؤه على مستندٍ مُغلقٍ (مُحمَّل) يستدعي تلقائيًّا التّابع Document.open()، الذي سيحذف محتويات المستند. البنية العامة document.write(markup);
markup سلسلة نصيّة تحتوي على النّص المرغوب كتابته على المستند. مثال <!DOCTYPE html>
<html>
<head>
<title>write مثال</title>
<script>
function newContent() {
alert("تحميل محتوى جديد");
document.open();
document.write("<h1>المحتوى ...
Document.visibilityState
تُعيد الخاصيّة Document.visibilityState القابلة للقراءة فقط حالةَ ظهور المُستند، أي سياق وضوح العنصر الحالي. إذ من المُفيد معرفة ما إذا كان المُستند في الخلفيّة أو في تبويب (لسان، tab) غير مرئي حاليًّا، أو أنّ الصّفحة قد حُمّلت فقط من أجل ما قبل التّصيير (pre-rendering). القيم المُمكنة هي كما يلي: 'visible': تُشير إلى أنّ مُحتويات الصّفحة قد تكون ظاهرة ولو جزئيّا. هذا يعني بأنّ الصفحة موجودة على تبويب أمامي في نافذة غيرِ مُصغّرة. 'hidden': مُحتويات الصّفحة غير واضحة للمستخدم. هذا يعني ...
Document.execCommand()
عندما ينتقل مستند HTML إلى نمط التّصميم designMode فإنّ كائن المستند يوفّر التّابع Document.execCommand() الذي يسمح للمستخدم بتنفيذ الأوامر للتعامل مع محتويات المنطقة القابلة للتّعديل. تؤثّر معظم هذه الأوامر على محتويات المستند الموجودة (تعديل النصوص لجعلها بخط عريض أو مائل مثلًا)، فيما تُدخِل بعض الأوامر الأخرى عناصر جديدة (مثل إضافة رابط) أو تؤثّر على كامل السّطر (مثل إزاحته). عند استخدام الخاصيّة contentEditable، فاستدعاء التّابع Document.execCommand() يؤثّر على العنصر المُفعّل القابل للتعديل حاليًّا. البنية العامة bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)
القيمة ...
Document.enableStyleSheetsForSet()
يفعّل التّابع Document.enableStyleSheetsForSet() صفحات الأنماط التي توافق الاسم المُحدّد في مجموعة صفحات الأنماط الحاليّة، ويُعطّل جميع صفحات الأنماط الأخرى (عَدا تلك التي بدون عنوان، والتي تكون دائمًا مُفعّلة). البنية العامة document.enableStyleSheetsForSet(name)
name اسم صفحات الأنماط المرغوب تفعيلها. ستُفعّل جميع صفحات الأنماط التي توافق هذا الاسم، لكن ستُعطَّل جميع صفحات الأنماط الأخرى التي تملك عنوانًا. مرّر سلسلةً نصيّةً فارغةً لهذا المُعامل لتعطيل جميع صفحات الأنماط البديلة والمُفضّلة (دون صفحات الأنماط الدّائمة التي لا تملك خاصّية title). ملاحظات تُوافَقُ العناوين يكون حسّاسًا ...
Document.hasFocus()
يُعيد التّابع Document.hasFocus() قيمة منطقيّة من النّوع Boolean تدلّ على ما إذا كان المستند أو أي عنصرٍ داخل المستند مُركَّزًا عليه أو لا. يُستعمل هذا التّابع لتحديد ما إذا كان العنصر المفعّل في مستند مُركَّزًا عليه أو لا. ملاحظة: عند عرض مستندٍ ما، فالعنصر المُركّز عليه هو دائمًا العنصر المفعّل في المستند، لكنّ العنصر المفعّل لا يكون دائمًا مُركَّزًا عليه بالضّرورة. على سبيل المثال، عنصر مُفعّل داخل نافذة منبثقة في الخلفيّة لا يكون مركّزًا عليه. البنية العامة focused = document.hasFocus();
...
Document.hidden
تُعيد الخاصيّة Document.hidden قيمة منطقيّة تُشير إلى ما إذا كانت الصّفحة مخفية أم لا. لاحظ أنّ هذه الخاصّية قابلة للقراءة فقط. البنية العامّة var boolean = document.hidden
مثال document.addEventListener("visibilitychange", function() {
console.log( document.hidden );
// افعل شيئا ما
});
دعم المتصفحات الميزة Chrome Firefox Internet Explorer Opera Safari الدعم الأساسي 13 مع السابقة -webkit- ، 33 دون سابقة. 18 10 12.10 7 مصادر ومواصفات مواصفة Page Visibility (Second Edition).
Document.querySelector()
يُعيد التّابع Document.querySelector() أول كائنٍ من النّوع Element الذي يُمثّل العنصر المُوافِق للمُحدِّد أو المحدّدات المعطاة. ويُعيد القيمة null في حالة لم يجِد أيّ عنصر. مُلاحظة: يتمّ البحث باستعمال المرور على العمق أولًا قبل التّرتيب (depth-first pre-order traversal) حول عقد المستند بدايةً من أول عنصر في هيكل المستند ويُكرّر (iterating) حول العقد في القائمة مرتّبةً حسب عدد العقد الأبناء. البنية العامة element = document.querySelector(selectors);
selectors سلسلة نصيّة من النّوع DOMString تحتوي على مُحدّد واحدٍ أو أكثر لمُوافقته مع عناصر المستند ...
Document.scripts
خاصيّة قابلة للقراءة فقط تُعيد جميع عناصر <script> في المُستند. والقيمة المُعادة كائنٌ من النّوع HTMLCollection. البنية العامة var scriptList = document.scripts;
القيمة المُعادة كائنٌ من النّوع HTMLCollection. يُمكنك التّعامل مع المُتغيّر scriptList كما تتعامل مع أي مصفوفة للوصول إلى جميع العناصر في القائمة. مثال المثال التّالي يتحقّق ممّا إذا كان للصّفحة الحاليّة أي عنصر <script>: var scripts = document.scripts;
if (scripts.length) {
alert("هذه الصّفحة تحتوي على سكربتات");
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم ...
Document.writeln()
يكتب التّابع Document.writeln() سلسلةً نصيّةً متبوعةً بمحرف سطرٍ جديدٍ (newline character) على المستند. البنية العامة document.writeln(line);
line سلسلة نصيّة تحتوي على سطر النّص المرغوب إضافته. مثال document.writeln("<p>أدخل كلمة المرور</p>");
ملاحظات التّابع Document.writeln() مشابه للتّابع Document.write() لكنّه يُضيف سطرًا جديدًا. كما هو الحال مع التّابع Document.write() فالتّابع Document.writeln() لا يعمل كذلك في مستندات XHTML، وستحصل على خطأ NS_ERROR_DOM_NOT_SUPPORTED_ERR يفيد بأنّ العمليّة غير مدعومة في سطر أوامر الأخطاء. يحدث هذا عن محاولة فتح ملفّ محليّ ذو الامتداد .xhtml أو أي مستندٍ مُقدَّمٍ ...
Document.plugins
تُعيد الخاصيّة Document.plugins مجموعةً من النّوع HTMLCollection تحتوي على قائمة بجميع عناصر <embed> الموجودة في المُستند الحاليّ. كلّ عنصر في المجموعة يُعدّ من النّوع HTMLEmbedElement، يُمكن أن يكون عدد العناصِر واحدًا أو أكثر، وفي حالة لم يوجَد أي عنصر، فستُعاد القيمة null. مُلاحظة: للحصول على قائمة بالإضافات (plugins) المُنصَّبة، استعمل الخاصيّة NavigatorPlugins.plugins. البنية العامة embedArrayObj = document.plugins
مصادر ومواصفات مواصفة HTML Living Standard
Document.embeds
تُعيد الخاصّية embeds قائمةً بالكائنات المُضمّنة داخل المُستند الحالي. البنية العامة nodeList = document.embeds
مصادر ومواصفات مواصفة HTML Living Standard.
Document.lastModified
تُعيد الخاصية document.lastModified سلسلةً نصيةً تحتوي على تاريخ ووقتِ آخر تعديلٍ للمُستند الحاليّ. البنية العامة string = document.lastModified;
مثال طريقة الاستعمال البسيطة: alert(document.lastModified);
// يُعيد تاريخا مُشابها لما يلي
// 03/22/2018 05:20:48
تحويل قيمة lastModified إلى كائن من النّوع Date: var oLastModif = new Date(document.lastModified);
تحويل قيمة lastModified إلى عدد الأجزاء من ألف جزء من الثّانيّة التّي مرّت منذ 1 يناير 1970 على السّاعة 00:00:00: var nLastModif = Date.parse(document.lastModified);
ملاحظات لاحظ بأنّه لا يُمكن استعمال السّلسة النّصيّة التي تُعيدها الخاصيّة lastModified ...
Document.selectedStyleSheetSet
تُعيد اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا. البنية العامة currentStyleSheetSet = document.selectedStyleSheetSet
document.selectedStyleSheet = newStyleSheetSet
عند الإعادة، سيحمل المتغيّر currentStyleSheetSet اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا، يُمكنك كذلك ضبط مجموعة صفحات الأنماط باستعمال هذه الخاصيّة. ضبط قيمة لهذه الخاصيّة مُكافئٌ لاستدعاء التّابع document.enableStyleSheetsForSet() باستخدام القيمة currentStyleSheetSet، ثمّ ضبط نفس القيمة للخاصية lastStyleSheetSet أيضًا. مُلاحظة: قيمة هذه الخاصيّة حيّة؛ تغيير الخاصيّة disabled على صفحات الأنماط سيُؤثّر على قيمة هذه الخاصيّة. مثال console.log("مجموعة صفحات الأنماط الجاري استعمالها حاليًّا:" + document.selectedStyleSheetSet);
document.selectedStyleSheetSet = ...
Document.designMode
تُستعمل الخاصيّة Document.designMode للتّحكّم فيما إذا أمكن تعديل كامِلِ المُستند أو لا. القيَم الصّالحة هي "on" و"off". وحسب المُواصفة، فالقيمة الافتراضيّة لهذه الخاصّية هي "off"، لكنّ القيمة تكون بأحرفٍ كبيرة (capitalized) في مُتصفّح Internet Explorer. البنية العامة var mode = document.designMode;
document.designMode = "on";
document.designMode = "off";
مثال جعْلُ مُستندِ عنصرِ <iframe> قابلًا للتّعديل: iframeNode.contentDocument.designMode = "on";
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard.
عرض (250 السابقة | 250 التالية) (20 | 50 | 100 | 250 | 500).
يُعرِّف العنصر <tr> سطرًا يحتوي على خلايا في جدول، وهذه الخلايا تُمثَّل عبر العنصرين <td> و <th>. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. ...
Document.evaluate()
يُنشئ التّابع Document.evaluate() كائنًا من النّوع XPathResult مبني على تعبير XPath ومعاملات معطاة أخرى. البنية العامة var xpathResult = document.evaluate(
xpathExpression,
contextNode,
namespaceResolver,
resultType,
result
);
xpathExpression سلسة نصيّة تُمثّل تعبير XPath المرغوب تقديره (evaluate). contextNode يُحدّد عقدة السّياق للاستعلام (انظر مواصفة XPath). من الشّائع تمرير كائن المستند document كعقدة سياق. namespaceResolver دالّة تُمرَّر لها سابقات مجالات الأسماء (namespace prefixes) لتُعيد سلسلةً نصيّة تُمثّل عنوان URI مجال الأسماء المرتبط بالسّابقة المُمرَّرة. ستُستعمل لحلّ السّابقات داخل تعبير XPath ...
العنصر
يُعرِّف العنصر <area> منطقةً في خريطة لصورة، ويمكن أن ترتبط تلك المنطقة (اختياريًا) مع رابط فائق. لا يمكن استخدام هذا العنصر إلا ضمن عنصر <map>. لمشاهدة مثال متكامل عن استخدام العنصر <area>، راجع صفحة العنصر <map>. بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي أو عنصر عادي. المحتوى المسموح لا يوجد، فهو عنصرٌ فارغ. الوسم المختصر يجب أن يكون وسم البداية موجودًا، ويجب أن يُحذَف وسم النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي؛ لكن يجب أن يكون العنصر <area> متواجدًا ضمن ...
التابع .fadeToggle() في jQuery
.fadeToggle( [duration ] [, easing ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة أو يخفيها عن طريق تحريك درجة العتامة. .fadeToggle( [duration ] [, easing ] [, complete ] ) أُضيف مع الإصدار: 1.4.4. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. easing (القيمة الافتراضية: swing) سلسلة نصية من النوع String، تُشير إلى دالة التخفيف المستخدمة في عملية التحوّل. complete دالة على الشكل ...
العنصر
يُستعمَل العنصر <audio> لتضمين المحتوى الصوتي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب الملفات الصوتية لتشغيلها. المثال الآتي يستخدم العنصر <audio> مع الخاصية autoplay لتشغيل الصوت تلقائيًا مع تحديد رابط URL للملف المصدري عبر الخاصية src: <audio src="khamsat.mp3" autoplay>
لا يدعم متصفحك العنصر <code>audio</code>.
</audio>
أما المثال الآتي ففيه العنصر <audio> مع استخدام خاصية controls لإضافة أزرار للتحكم بالمقطع، وسيُحدَّد رابط URL للمقطع عبر العنصر <source>: ...
التابع .fadeIn() في jQuery
.fadeIn( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يعرض هذا التابع العناصر المطابقة عن طريق تحويلها إلى الإعتام (opaque، أي لن تصبح شفافةً) تدريجيًا. .fadeIn( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .fadeIn( options ) أُضيف مع الإصدار: 1.0. options ...
العنصر
يُعرِّف العنصر <th> خليةً تُمثِّل ترويسةً في الجدول الذي يحتويها. تُعرّف طبيعة هذه الترويسة عبر الخاصيتين scope و headers. مثال عن استخدام الخاصية scope لتحديد ما هي الخلايا التي تُمثِّلها ترويسة ما: <table>
<caption>معلومات التواصل</caption>
<tbody>
<tr>
<th scope="col">الاسم</th>
<th scope="col">رقم الهاتف</th>
<th scope="col">المدينة</th>
</tr>
<tr>
<th scope="row">الموظف 1</th>
...
تعليمات الشرطات المائلة الثلاث في TypeScript
مقدمة تعليمات الشرطات المائلة الثلاث (Triple-slash directives) هي تعليقات تكتب في سطر واحد تحتوي على وسم XML واحد. تُستخدَم محتويات التعليق كتعليمات (إرشادات) للمترجم. تكون تعليمات الشرطات المائلة الثلاث صالحةً فقط في أعلى الملفّ الذي تكون هذه التعليمات موجودة داخله. ويُمكن لهذه التعليمات أن تُسبَق فقط بتعليق في سطر واحد أو تعليق متعدّد الأسطر (multi-line comment)، ما يشمل تعليمات شرطات مائلة ثلاث أخرى. إذا وُجِدَت بعد جملة أو تصريح فستُعامَل على أنها تعليقات عادية في سطر واحد (regular single-line comments)، ...
العنصر
يُعرِّف العنصر <td> خليةً في الجدول الذي يحتويها. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح المحتوى التنظيمي. الوسم المختصر لا ...
العنصر
يُحدِّد العنصر <link> العلاقات بين المستند الحالي وبين مورد خارجي (external resource)؛ من استخدامات هذا الوسم تتضمن تعريف علاقة بين الصفحات للتنقل بينها، بيد أنَّ أكثر استخدامات هذا العنصر شيوعًا هو تضمين صفحات الأنماط. استخدام الشكل الآتي للعنصر <link> لتضمين صفحة أنماط في المستند: <link href="style.css" rel="stylesheet">
بطاقة العنصر تصنيفات المحتوى البيانات الوصفية المحتوى المسموح لا يوجد، فهذا العنصر فارغ. الوسم المختصر لمّا كان هذا العنصر فارغًا، فيجب توفير وسم البداية وحذف وسم النهاية. العناصر الأب أي عنصر يقبل وجود ...
العنصر
يُمثِّل العنصر <button> زرًا قابلًا للضغط. مثال عن استخدام العنصر <button>: <button name="button">اضغط هنا</button>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي وعنصر عادي، وعنصر تفاعلي ... المحتوى المسموح المحتوى العادي. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي. واجهة DOM HTMLButtonElement دعم المتصفحات Chrome Firefox Edge Safari Opera مدعوم مدعوم مدعوم مدعوم مدعوم الخاصيات يمكن استخدام الخاصيات العامة في هذا العنصر. autofoucs تسمح لنا هذه الخاصية المنطقية (Boolean) بتحدد أنَّنا نريد ...
العنصر
يُمثِّل العنصر <form> قسمًا في المستند الذي يحتوي على عناصر يستطيع المستخدم التفاعل معها لإرسال بيانات إلى خادوم الويب. مثال بسيط عن نموذج يُرسَل عبر الطريقة GET: <form action="" method="get">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال بسيط عن نموذج يُرسَل عبر الطريقة POST: <form action="" method="post">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال عن نموذج يبيّن استخدام العناصر <fieldset> و <legend> و <label>: <form action="" method="post">
<fieldset>
...
العنصر
يُستعمَل العنصر <video> لتضمين المحتوى المرئي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب صيغة لتشغيلها. مثال عن استخدام العنصر <video> لإضافة مقطع فيديو بصيغة WebM (عبر الخاصية src) بارتفاع 360، مع عرض عناصر التحكم (عبر الخاصية controls) وله صورة غلاف تُعرَض إلى أن يبدأ تشغيله (الخاصية poster)، وستُعرَض رسالة نصية تنوِّه المستخدم أنَّ متصفحه لا يدعم العنصر <video>: <video src="khamsat.webm" controls poster="khamsat-poster.jpg" height="360">
لا ...
التابع .slideDown() في jQuery
()slideDown. القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يُظهِر هذا التابع جميع العناصر المتطابقة مع حركة انسحابيَّة. .slideDown( [duration ] [, complete ] ) أضيف مع الإصدار 1.0. duration عدد أو سلسلة نصية تمثِّل كمية الوقت الذي ستستغرقه عملية تحريك العنصر، وقيمته الافتراضيَّة هي 400. complete دالةٌ من الشكل Function() وتُستدعَى مرةً وحدةً مع كل عنصر من العناصر المطابقة بعد اكتمال الحركة المطبَّقة عليه. .slideDown( options ) أضيف مع الإصدار: 1.0. Options كائن من النوع Object، وهو مجموعة من ...
التابع .toggle() في jQuery
.toggle( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يبدِّل هذا التابع حالة العناصر المُطابقة بين العرض و الإخفاء. .toggle( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .toggle( options ) أُضيف مع الإصدار: 1.0. options كائن من النوع Object، ويقدم مجموعة من ...
Document.getElementsByClassName()
يُعيد التّابع Document.getElementsByClassName() كائنًا مُشابهًا للمصفوفات يحتوي على جميع العناصر الأولاد التي تحمل نفس اسم الصّنف (class name) المُعطى. عند استدعائه على كائن المُستند، فسيُبحَثُ في كامل المُستند، ما يشمل العقدة الجذر. يُمكن كذلك استدعاء التّابع getElementsByClassName() على أي عنصر؛ وسيُعيد العناصر الأولاد للعنصر الجذر المُحدَّد ذات أسماء الأصناف المعطاة. البنية العامة var elements = document.getElementsByClassName(names);
// أو
var elements = rootElement.getElementsByClassName(names);
elements كائنٌ حيّ من النّوع HTMLCollection الذي يُمثّل مجموعة العناصِر التي وُجدت. names سلسلةٌ نصيّةٌ تُمثّل قائمة أسماء الأصناف المرغوب ...
Document.queryCommandSupported()
يشير التّابع Document.queryCommandSupported() إلى ما إذا كان أمر التّحرير المعطى مدعومًا من طرف المتصفّح أم لا. البنية العامة isSupported = document.queryCommandSupported(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أم لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مدعومًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandSupported("SelectAll");
if(flg) {
// نفّذ عمليّةً ما
}
ملاحظات يعيد الأمر 'paste' القيمة false في حالة لم يكن الأمر متاحًا إضافةً إلى حالة كون السكربت المستدعي ...
Document.fullscreenElement
تُعيد الخاصية Document.fullscreenElement القابلة للقراءة فقط العنصر Element الذي في وضع ملء الشاشة حاليًا ضمن عناصر المستند الحالي، أو تُعيد القيمة null في حالة لم يكن وضع ملء الشاشة مُفعلًا. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var element = document.fullscreenElement;
ستكون قيمة المتغيّر element هي إشارةٌ إلى العنصر الموجود في وضع ملء الشاشة حاليًا، أو القيمة null في حالة ...
Document.createCDATASection()
يُنشئُ التّابع Document.createCDATASection() عقدةَ قسم CDATA جديدةً ويُعيدها. البنية العامة CDATASectionNode = document.createCDATASection(data)
CDATASectionNode يُمثّل عقدةً من النّوع CDATASection. data سلسلةٌ نصيّة تحتوي على البيانات المرغوب إضافتها إلى قسم CDATA. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml")
var cdata = docu.createCDATASection('هنا عقدة البيانات');
docu.getElementsByTagName('xml')[0].appendChild(cdata);
alert(new XMLSerializer().serializeToString(docu));
// ستَعرضُ
// <xml><![CDATA[هنا عقدة البيانات]]></xml>
ملاحظات يعمل هذا مع مستندات XML فقط، ولا يعمل مع مستندات HTML (لأنّ مُستندات HTML لا تدعم أقسام CDATA)؛ مُحاولة استعمال التّابع مع مُستندات HTML سترمي الاستثناء NOT_SUPPORTED_ERR. سترمي كذلك الاستثناء NS_ERROR_DOM_INVALID_CHARACTER_ERR ...
Document.createExpression()
يُجمّع التّابع Document.createExpression() استعلام XPathExpression، والذي يُمكن استعماله بعد ذلك لإجراء تقديرات (evaluations) يُمكن تكرارها. البنية العامة xpathExpr = document.createExpression(xpathText, namespaceURLMapper);
xpathText سلسلة نصيّة تُمثّل تعبير XPath المرغوب تجميعه. namespaceURLMapper دالّة تربط سابقة مجال أسماءٍ (namespace prefix) برابط URL مجال أسماءٍ أو القيمة null إن لم يكن ذلك مطلوبًا. القيمة المعادة كائنٌ من النّوع XPathExpression.
Document.onfullscreenchange
الخاصيّة Document.onfullscreenchange مُعالِج أحداثٍ للحدث fullscreenchange الذي يُطلَق عندما يلِج أو يخرج مُستندٌ من وضع ملء الشّاشة. البنية العامة targetDocument.onfullscreenchange = fullscreenChangeHandler;
مثال document.onfullscreenchange = function ( event ) {
console.log("هناك تغيّر في وضع ملء الشّاشة")
};
document.documentElement.onclick = function () {
// يجب استدعاء التّابع
// requestFullscreen()
// داخل مُعالج أحداث لكي لا يفشَل استدعاؤه
document.documentElement.requestFullscreen();
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي 45 47 وراء full-screen-api.unprefix.enabled ؟ ؟ ؟ ...
Document.location
تُعيد الخاصيّة Document.location القابلة للقِراءة فقط كائنًا من النّوع Location، والذي يحتوي على معلومات حول عنوان URL الخاصّ بالمُستند ويُتيح توابع لتعديل عنوان URL هذا وتحميل عنوان URL آخر. ورغم أنّ الخاصيّة Document.location للقِراءة فقط، إلا أنّك تستطيع تعيين سلسلة نصيّة من النّوع DOMString لها كذلك. ما يعني بأنّك تستطيع التّعامل مع هذه الخاصيّة بصفتها سلسلة نصيّة عاديّة في مُعظم الحالات. والسّطران التّاليّان مُتكافئان: document.location = 'http://www.example.com'
document.location.href = 'http://www.example.com'
للحصول على عنوان URL المُستندِ وحده، يُمكنك استعمال الخاصيّة document.URL كذلك. ...
Document.createComment()
يُنشئُ التّابع Document.createComment() عقدةَ تعليق جديدةً ويُعيدها. البنية العامة CommentNode = document.createComment(data)
data سلسلةٌ نصيّة تحتوي على التعليق المرغوب إضافته. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml");
var comment = docu.createComment('هذا تعليق');
docu.getElementsByTagName('xml')[0].appendChild(comment);
alert(new XMLSerializer().serializeToString(docu));
// تعرض
// <xml><!--هذا تعليق--></xml>
مصادر ومواصفات مواصفة createComment
Document.queryCommandEnabled()
يشير التّابع Document.queryCommandEnabled() إلى ما إذا كان أمر التّحرير المعطى مفعّلًا من طرف المتصفّح أم لا. البنية العامة isEnabled = document.queryCommandEnabled(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أو لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مُفعّلًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandEnabled("SelectAll");
if(flg) {
document.execCommand("SelectAll", false, null); // الأمر مُفعّل، لذا نفّذه
}
ملاحظات بالنّسبة للأمران 'cut' و'copy' فإنّ التّابع يعيد القيمة true فقط إن استدعيَ في ...
Document.fullscreenEnabled
تُعيد الخاصية Document.fullscreenEnabled القابلة للقراءة فقط كائنًا من النوع Boolean يُشير إلى ما إذا كان وضع ملء الشاشة مُتاحًا أم لا. وضع ملء الشاشة مُتاح للصفحات التي لا تحتوي على إضافات ذات نوافِذَ في أي من مُستنداتها فقط، وفي حالة كانت جميع عناصر <iframe> التي تحوي المُستند ذات خاصيّة allowfullscreen مضبوطة. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var isFullscreenAvailable ...
Document.dir
الخاصيّة Document.dir خاصيّةٌ من النّوع DOMString تُمثّل اتّجاهيّة النّص في المُستند، إمّا من اليسار إلى اليمين (وهو الخيار الافتراضي) أو من اليمين إلى اليسار. القيَم المُمكنة هي 'rtl' أي من اليمين إلى اليسار، والقيمة 'ltr' التّي تعني من اليسار إلى اليمين. البنية العامة dirStr = document.dir;
document.dir = dirStr;
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم ؟ ؟ مصادر ومواصفات مواصفة HTML Living Standard.
Document.defaultView
في المُتصفحات، تُعيد الخاصيّة Document.defaultView الكائن window المُرتبط بالمستند، أو القيمة null إن لم يكن متوافرًا. البنية العامة var win = document.defaultView;
الخاصيّة قابلة للقراءة فقط. دعم المتصفحات الميزة Chrome Edge Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard. مواصفة HTML5.
Document.exitPointerLock()
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. يُحرّر التّابع Document.exitPointerLock() قفل مؤشّر الفأرة بشكل غير مُتزامنٍ حسب طلبٍ سابقٍ من Element.requestPointerLock. للتحقّق من نجاح أو فشل الطّلب، لابدّ من الاستماع للحدثين pointerlockchange وpointerlockerror. البنية العامة document.exitPointerLock();
دعم المتصفحات الميزة Chrome Edge Firefox Internet Explorer Opera Safari الدعم الأساسي نعم (قد تحتاج إلى السّابقة -webkit في إصدارات قديمة) نعم نعم، مع السّابقة -moz 50 دون سابقة ؟ ؟ ؟ انظر أيضًا Document.pointerLockElement Element.requestPointerLock مصادر ومواصفات ...
Document.head
تُعيد الخاصية document.head العنصر <head> الخاصّ بالمُستند الحالي. إن كان للمُستند أكثر من عنصر <head> واحد، فالقيمة المُعادة ستُمثّل العنصر الأول. البنية العامة var objRef = document.head;
مثال // نضع ما يلي
// في ملفّ
// HTML
// <head id="my-document-head">
var aHead = document.head;
alert(aHead.id); // "my-document-head";
alert( document.head === document.querySelector("head") ); // true
ملاحظات الخاصيّة document.head للقِراءة فقط. مُحاولة ضبط قيمة لها سيفشَل دون أي أخطاء، أو سيرمي خطأ TypeError في مُتصفّح Firefox في حالة كان المستند في نمط strict. دعم المتصفحات الميزة Chrome Edge ...
Document.preferredStyleSheetSet
تُعيد مجموعة صفحات الأنماط المُفضّلة حسب ما ضبطه كاتب الصّفحة. وهي للقراءة فقط. البنية العامّة preferredStyleSheetSet = document.preferredStyleSheetSet
تُشير قيمة المتغيّر preferredStyleSheetSet إلى مجموعة صفحات الأنماط المُفضّلة من طرف كاتب الصّفحة. يُحدَّدُ هذا من خلال ترتيب تعريفات صفحات الأنماط وترويسة HTTP ذات العنوان Default-Style. إن لم تكن هناك مجموعة صفحات أنماط مُفضَّلة من طرف الكاتب، فستكون القيمة المُعادة سلسلةً نصية فارغة (""). مثال if (document.preferredStyleSheetSet) {
console.log("مجموعة صفحات الأنماط المُفضّلة هي:" + document.preferredStyleSheetSet);
} else {
console.log("لا توجد صفحة ...
Document.onselectionchange
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. الخاصيّة Document.onselectionchange مُعالِج أحداثٍ للحدث selectionchange الذي يُطلَق عندما يتغيّر تظليل الكائن. البنية العامة obj.onselectionchange = function;
المُتغيّر function هي دالّة عرّفها المُستخدم user-defined، دون اللاحقة () أو أية مُعاملات، أو تعريفٌ لدالّةٍ مجهولة (anonymous function). مثال document.onselectionchange = function() { console.log("لقد تغيّر التّظليل"); };
دعم المتصفحات الميزة Chrome Internet Explorer Edge Firefox Opera Safari الدعم الأساسي 49 ؟ نعم 45 ؟ ؟ انظر أيضًا selectionchange selectstart ...
Document.timeline
تنبيه: هذه تقنيّة تجريبيّة، انظر جدول دعم المُتصفحات قبل استعمال هذه الخاصيّة في شيفرة إنتاجيّة. تُعيد الخاصيّة القابلة للقراءة فقط timeline المُعرَّفة على الواجهة Document الخطَّ الزمني الافتراضي للمُستند الحالي. هذا الخط الزّمني كائن خاص من النوع DocumentTimeline الذي يُنشأ تلقائيا عند تحميل الصّفحة. الخطّ الزمني فريد لكل مستند ويبقى طيلة مُدّة بقاء المُستند حيًّا، ما يشمل استدعاءات التّابع document.open(). تُحسب القيم الزمنية لهذا الخط الزمني حسب حدّ ثابت (fixed offset) من السّاعة العموميّة بحيث يُكافئ وقتُ الصّفر (zero time) ...
Document.write()
يكتب التّابع Document.write() سلسلةً نصيّةً إلى مجرى (stream) مستندٍ فُتح بالتّابع window.open(). مُلاحظة: لأنّ التّابع Document.write() يكتب إلى مجرى المستند، فاستدعاؤه على مستندٍ مُغلقٍ (مُحمَّل) يستدعي تلقائيًّا التّابع Document.open()، الذي سيحذف محتويات المستند. البنية العامة document.write(markup);
markup سلسلة نصيّة تحتوي على النّص المرغوب كتابته على المستند. مثال <!DOCTYPE html>
<html>
<head>
<title>write مثال</title>
<script>
function newContent() {
alert("تحميل محتوى جديد");
document.open();
document.write("<h1>المحتوى ...
Document.visibilityState
تُعيد الخاصيّة Document.visibilityState القابلة للقراءة فقط حالةَ ظهور المُستند، أي سياق وضوح العنصر الحالي. إذ من المُفيد معرفة ما إذا كان المُستند في الخلفيّة أو في تبويب (لسان، tab) غير مرئي حاليًّا، أو أنّ الصّفحة قد حُمّلت فقط من أجل ما قبل التّصيير (pre-rendering). القيم المُمكنة هي كما يلي: 'visible': تُشير إلى أنّ مُحتويات الصّفحة قد تكون ظاهرة ولو جزئيّا. هذا يعني بأنّ الصفحة موجودة على تبويب أمامي في نافذة غيرِ مُصغّرة. 'hidden': مُحتويات الصّفحة غير واضحة للمستخدم. هذا يعني ...
Document.execCommand()
عندما ينتقل مستند HTML إلى نمط التّصميم designMode فإنّ كائن المستند يوفّر التّابع Document.execCommand() الذي يسمح للمستخدم بتنفيذ الأوامر للتعامل مع محتويات المنطقة القابلة للتّعديل. تؤثّر معظم هذه الأوامر على محتويات المستند الموجودة (تعديل النصوص لجعلها بخط عريض أو مائل مثلًا)، فيما تُدخِل بعض الأوامر الأخرى عناصر جديدة (مثل إضافة رابط) أو تؤثّر على كامل السّطر (مثل إزاحته). عند استخدام الخاصيّة contentEditable، فاستدعاء التّابع Document.execCommand() يؤثّر على العنصر المُفعّل القابل للتعديل حاليًّا. البنية العامة bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)
القيمة ...
Document.enableStyleSheetsForSet()
يفعّل التّابع Document.enableStyleSheetsForSet() صفحات الأنماط التي توافق الاسم المُحدّد في مجموعة صفحات الأنماط الحاليّة، ويُعطّل جميع صفحات الأنماط الأخرى (عَدا تلك التي بدون عنوان، والتي تكون دائمًا مُفعّلة). البنية العامة document.enableStyleSheetsForSet(name)
name اسم صفحات الأنماط المرغوب تفعيلها. ستُفعّل جميع صفحات الأنماط التي توافق هذا الاسم، لكن ستُعطَّل جميع صفحات الأنماط الأخرى التي تملك عنوانًا. مرّر سلسلةً نصيّةً فارغةً لهذا المُعامل لتعطيل جميع صفحات الأنماط البديلة والمُفضّلة (دون صفحات الأنماط الدّائمة التي لا تملك خاصّية title). ملاحظات تُوافَقُ العناوين يكون حسّاسًا ...
Document.hasFocus()
يُعيد التّابع Document.hasFocus() قيمة منطقيّة من النّوع Boolean تدلّ على ما إذا كان المستند أو أي عنصرٍ داخل المستند مُركَّزًا عليه أو لا. يُستعمل هذا التّابع لتحديد ما إذا كان العنصر المفعّل في مستند مُركَّزًا عليه أو لا. ملاحظة: عند عرض مستندٍ ما، فالعنصر المُركّز عليه هو دائمًا العنصر المفعّل في المستند، لكنّ العنصر المفعّل لا يكون دائمًا مُركَّزًا عليه بالضّرورة. على سبيل المثال، عنصر مُفعّل داخل نافذة منبثقة في الخلفيّة لا يكون مركّزًا عليه. البنية العامة focused = document.hasFocus();
...
Document.hidden
تُعيد الخاصيّة Document.hidden قيمة منطقيّة تُشير إلى ما إذا كانت الصّفحة مخفية أم لا. لاحظ أنّ هذه الخاصّية قابلة للقراءة فقط. البنية العامّة var boolean = document.hidden
مثال document.addEventListener("visibilitychange", function() {
console.log( document.hidden );
// افعل شيئا ما
});
دعم المتصفحات الميزة Chrome Firefox Internet Explorer Opera Safari الدعم الأساسي 13 مع السابقة -webkit- ، 33 دون سابقة. 18 10 12.10 7 مصادر ومواصفات مواصفة Page Visibility (Second Edition).
Document.querySelector()
يُعيد التّابع Document.querySelector() أول كائنٍ من النّوع Element الذي يُمثّل العنصر المُوافِق للمُحدِّد أو المحدّدات المعطاة. ويُعيد القيمة null في حالة لم يجِد أيّ عنصر. مُلاحظة: يتمّ البحث باستعمال المرور على العمق أولًا قبل التّرتيب (depth-first pre-order traversal) حول عقد المستند بدايةً من أول عنصر في هيكل المستند ويُكرّر (iterating) حول العقد في القائمة مرتّبةً حسب عدد العقد الأبناء. البنية العامة element = document.querySelector(selectors);
selectors سلسلة نصيّة من النّوع DOMString تحتوي على مُحدّد واحدٍ أو أكثر لمُوافقته مع عناصر المستند ...
Document.scripts
خاصيّة قابلة للقراءة فقط تُعيد جميع عناصر <script> في المُستند. والقيمة المُعادة كائنٌ من النّوع HTMLCollection. البنية العامة var scriptList = document.scripts;
القيمة المُعادة كائنٌ من النّوع HTMLCollection. يُمكنك التّعامل مع المُتغيّر scriptList كما تتعامل مع أي مصفوفة للوصول إلى جميع العناصر في القائمة. مثال المثال التّالي يتحقّق ممّا إذا كان للصّفحة الحاليّة أي عنصر <script>: var scripts = document.scripts;
if (scripts.length) {
alert("هذه الصّفحة تحتوي على سكربتات");
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم ...
Document.writeln()
يكتب التّابع Document.writeln() سلسلةً نصيّةً متبوعةً بمحرف سطرٍ جديدٍ (newline character) على المستند. البنية العامة document.writeln(line);
line سلسلة نصيّة تحتوي على سطر النّص المرغوب إضافته. مثال document.writeln("<p>أدخل كلمة المرور</p>");
ملاحظات التّابع Document.writeln() مشابه للتّابع Document.write() لكنّه يُضيف سطرًا جديدًا. كما هو الحال مع التّابع Document.write() فالتّابع Document.writeln() لا يعمل كذلك في مستندات XHTML، وستحصل على خطأ NS_ERROR_DOM_NOT_SUPPORTED_ERR يفيد بأنّ العمليّة غير مدعومة في سطر أوامر الأخطاء. يحدث هذا عن محاولة فتح ملفّ محليّ ذو الامتداد .xhtml أو أي مستندٍ مُقدَّمٍ ...
Document.plugins
تُعيد الخاصيّة Document.plugins مجموعةً من النّوع HTMLCollection تحتوي على قائمة بجميع عناصر <embed> الموجودة في المُستند الحاليّ. كلّ عنصر في المجموعة يُعدّ من النّوع HTMLEmbedElement، يُمكن أن يكون عدد العناصِر واحدًا أو أكثر، وفي حالة لم يوجَد أي عنصر، فستُعاد القيمة null. مُلاحظة: للحصول على قائمة بالإضافات (plugins) المُنصَّبة، استعمل الخاصيّة NavigatorPlugins.plugins. البنية العامة embedArrayObj = document.plugins
مصادر ومواصفات مواصفة HTML Living Standard
Document.embeds
تُعيد الخاصّية embeds قائمةً بالكائنات المُضمّنة داخل المُستند الحالي. البنية العامة nodeList = document.embeds
مصادر ومواصفات مواصفة HTML Living Standard.
Document.lastModified
تُعيد الخاصية document.lastModified سلسلةً نصيةً تحتوي على تاريخ ووقتِ آخر تعديلٍ للمُستند الحاليّ. البنية العامة string = document.lastModified;
مثال طريقة الاستعمال البسيطة: alert(document.lastModified);
// يُعيد تاريخا مُشابها لما يلي
// 03/22/2018 05:20:48
تحويل قيمة lastModified إلى كائن من النّوع Date: var oLastModif = new Date(document.lastModified);
تحويل قيمة lastModified إلى عدد الأجزاء من ألف جزء من الثّانيّة التّي مرّت منذ 1 يناير 1970 على السّاعة 00:00:00: var nLastModif = Date.parse(document.lastModified);
ملاحظات لاحظ بأنّه لا يُمكن استعمال السّلسة النّصيّة التي تُعيدها الخاصيّة lastModified ...
Document.selectedStyleSheetSet
تُعيد اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا. البنية العامة currentStyleSheetSet = document.selectedStyleSheetSet
document.selectedStyleSheet = newStyleSheetSet
عند الإعادة، سيحمل المتغيّر currentStyleSheetSet اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا، يُمكنك كذلك ضبط مجموعة صفحات الأنماط باستعمال هذه الخاصيّة. ضبط قيمة لهذه الخاصيّة مُكافئٌ لاستدعاء التّابع document.enableStyleSheetsForSet() باستخدام القيمة currentStyleSheetSet، ثمّ ضبط نفس القيمة للخاصية lastStyleSheetSet أيضًا. مُلاحظة: قيمة هذه الخاصيّة حيّة؛ تغيير الخاصيّة disabled على صفحات الأنماط سيُؤثّر على قيمة هذه الخاصيّة. مثال console.log("مجموعة صفحات الأنماط الجاري استعمالها حاليًّا:" + document.selectedStyleSheetSet);
document.selectedStyleSheetSet = ...
Document.designMode
تُستعمل الخاصيّة Document.designMode للتّحكّم فيما إذا أمكن تعديل كامِلِ المُستند أو لا. القيَم الصّالحة هي "on" و"off". وحسب المُواصفة، فالقيمة الافتراضيّة لهذه الخاصّية هي "off"، لكنّ القيمة تكون بأحرفٍ كبيرة (capitalized) في مُتصفّح Internet Explorer. البنية العامة var mode = document.designMode;
document.designMode = "on";
document.designMode = "off";
مثال جعْلُ مُستندِ عنصرِ <iframe> قابلًا للتّعديل: iframeNode.contentDocument.designMode = "on";
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard.
عرض (250 السابقة | 250 التالية) (20 | 50 | 100 | 250 | 500).
يُعرِّف العنصر <th> خليةً تُمثِّل ترويسةً في الجدول الذي يحتويها. تُعرّف طبيعة هذه الترويسة عبر الخاصيتين scope و headers. مثال عن استخدام الخاصية scope لتحديد ما هي الخلايا التي تُمثِّلها ترويسة ما: <table>
<caption>معلومات التواصل</caption>
<tbody>
<tr>
<th scope="col">الاسم</th>
<th scope="col">رقم الهاتف</th>
<th scope="col">المدينة</th>
</tr>
<tr>
<th scope="row">الموظف 1</th>
...
تعليمات الشرطات المائلة الثلاث في TypeScript
مقدمة تعليمات الشرطات المائلة الثلاث (Triple-slash directives) هي تعليقات تكتب في سطر واحد تحتوي على وسم XML واحد. تُستخدَم محتويات التعليق كتعليمات (إرشادات) للمترجم. تكون تعليمات الشرطات المائلة الثلاث صالحةً فقط في أعلى الملفّ الذي تكون هذه التعليمات موجودة داخله. ويُمكن لهذه التعليمات أن تُسبَق فقط بتعليق في سطر واحد أو تعليق متعدّد الأسطر (multi-line comment)، ما يشمل تعليمات شرطات مائلة ثلاث أخرى. إذا وُجِدَت بعد جملة أو تصريح فستُعامَل على أنها تعليقات عادية في سطر واحد (regular single-line comments)، ...
العنصر
يُعرِّف العنصر <td> خليةً في الجدول الذي يحتويها. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح المحتوى التنظيمي. الوسم المختصر لا ...
العنصر
يُحدِّد العنصر <link> العلاقات بين المستند الحالي وبين مورد خارجي (external resource)؛ من استخدامات هذا الوسم تتضمن تعريف علاقة بين الصفحات للتنقل بينها، بيد أنَّ أكثر استخدامات هذا العنصر شيوعًا هو تضمين صفحات الأنماط. استخدام الشكل الآتي للعنصر <link> لتضمين صفحة أنماط في المستند: <link href="style.css" rel="stylesheet">
بطاقة العنصر تصنيفات المحتوى البيانات الوصفية المحتوى المسموح لا يوجد، فهذا العنصر فارغ. الوسم المختصر لمّا كان هذا العنصر فارغًا، فيجب توفير وسم البداية وحذف وسم النهاية. العناصر الأب أي عنصر يقبل وجود ...
العنصر
يُمثِّل العنصر <button> زرًا قابلًا للضغط. مثال عن استخدام العنصر <button>: <button name="button">اضغط هنا</button>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي وعنصر عادي، وعنصر تفاعلي ... المحتوى المسموح المحتوى العادي. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي. واجهة DOM HTMLButtonElement دعم المتصفحات Chrome Firefox Edge Safari Opera مدعوم مدعوم مدعوم مدعوم مدعوم الخاصيات يمكن استخدام الخاصيات العامة في هذا العنصر. autofoucs تسمح لنا هذه الخاصية المنطقية (Boolean) بتحدد أنَّنا نريد ...
العنصر
يُمثِّل العنصر <form> قسمًا في المستند الذي يحتوي على عناصر يستطيع المستخدم التفاعل معها لإرسال بيانات إلى خادوم الويب. مثال بسيط عن نموذج يُرسَل عبر الطريقة GET: <form action="" method="get">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال بسيط عن نموذج يُرسَل عبر الطريقة POST: <form action="" method="post">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال عن نموذج يبيّن استخدام العناصر <fieldset> و <legend> و <label>: <form action="" method="post">
<fieldset>
...
العنصر
يُستعمَل العنصر <video> لتضمين المحتوى المرئي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب صيغة لتشغيلها. مثال عن استخدام العنصر <video> لإضافة مقطع فيديو بصيغة WebM (عبر الخاصية src) بارتفاع 360، مع عرض عناصر التحكم (عبر الخاصية controls) وله صورة غلاف تُعرَض إلى أن يبدأ تشغيله (الخاصية poster)، وستُعرَض رسالة نصية تنوِّه المستخدم أنَّ متصفحه لا يدعم العنصر <video>: <video src="khamsat.webm" controls poster="khamsat-poster.jpg" height="360">
لا ...
التابع .slideDown() في jQuery
()slideDown. القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يُظهِر هذا التابع جميع العناصر المتطابقة مع حركة انسحابيَّة. .slideDown( [duration ] [, complete ] ) أضيف مع الإصدار 1.0. duration عدد أو سلسلة نصية تمثِّل كمية الوقت الذي ستستغرقه عملية تحريك العنصر، وقيمته الافتراضيَّة هي 400. complete دالةٌ من الشكل Function() وتُستدعَى مرةً وحدةً مع كل عنصر من العناصر المطابقة بعد اكتمال الحركة المطبَّقة عليه. .slideDown( options ) أضيف مع الإصدار: 1.0. Options كائن من النوع Object، وهو مجموعة من ...
التابع .toggle() في jQuery
.toggle( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يبدِّل هذا التابع حالة العناصر المُطابقة بين العرض و الإخفاء. .toggle( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .toggle( options ) أُضيف مع الإصدار: 1.0. options كائن من النوع Object، ويقدم مجموعة من ...
Document.getElementsByClassName()
يُعيد التّابع Document.getElementsByClassName() كائنًا مُشابهًا للمصفوفات يحتوي على جميع العناصر الأولاد التي تحمل نفس اسم الصّنف (class name) المُعطى. عند استدعائه على كائن المُستند، فسيُبحَثُ في كامل المُستند، ما يشمل العقدة الجذر. يُمكن كذلك استدعاء التّابع getElementsByClassName() على أي عنصر؛ وسيُعيد العناصر الأولاد للعنصر الجذر المُحدَّد ذات أسماء الأصناف المعطاة. البنية العامة var elements = document.getElementsByClassName(names);
// أو
var elements = rootElement.getElementsByClassName(names);
elements كائنٌ حيّ من النّوع HTMLCollection الذي يُمثّل مجموعة العناصِر التي وُجدت. names سلسلةٌ نصيّةٌ تُمثّل قائمة أسماء الأصناف المرغوب ...
Document.queryCommandSupported()
يشير التّابع Document.queryCommandSupported() إلى ما إذا كان أمر التّحرير المعطى مدعومًا من طرف المتصفّح أم لا. البنية العامة isSupported = document.queryCommandSupported(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أم لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مدعومًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandSupported("SelectAll");
if(flg) {
// نفّذ عمليّةً ما
}
ملاحظات يعيد الأمر 'paste' القيمة false في حالة لم يكن الأمر متاحًا إضافةً إلى حالة كون السكربت المستدعي ...
Document.fullscreenElement
تُعيد الخاصية Document.fullscreenElement القابلة للقراءة فقط العنصر Element الذي في وضع ملء الشاشة حاليًا ضمن عناصر المستند الحالي، أو تُعيد القيمة null في حالة لم يكن وضع ملء الشاشة مُفعلًا. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var element = document.fullscreenElement;
ستكون قيمة المتغيّر element هي إشارةٌ إلى العنصر الموجود في وضع ملء الشاشة حاليًا، أو القيمة null في حالة ...
Document.createCDATASection()
يُنشئُ التّابع Document.createCDATASection() عقدةَ قسم CDATA جديدةً ويُعيدها. البنية العامة CDATASectionNode = document.createCDATASection(data)
CDATASectionNode يُمثّل عقدةً من النّوع CDATASection. data سلسلةٌ نصيّة تحتوي على البيانات المرغوب إضافتها إلى قسم CDATA. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml")
var cdata = docu.createCDATASection('هنا عقدة البيانات');
docu.getElementsByTagName('xml')[0].appendChild(cdata);
alert(new XMLSerializer().serializeToString(docu));
// ستَعرضُ
// <xml><![CDATA[هنا عقدة البيانات]]></xml>
ملاحظات يعمل هذا مع مستندات XML فقط، ولا يعمل مع مستندات HTML (لأنّ مُستندات HTML لا تدعم أقسام CDATA)؛ مُحاولة استعمال التّابع مع مُستندات HTML سترمي الاستثناء NOT_SUPPORTED_ERR. سترمي كذلك الاستثناء NS_ERROR_DOM_INVALID_CHARACTER_ERR ...
Document.createExpression()
يُجمّع التّابع Document.createExpression() استعلام XPathExpression، والذي يُمكن استعماله بعد ذلك لإجراء تقديرات (evaluations) يُمكن تكرارها. البنية العامة xpathExpr = document.createExpression(xpathText, namespaceURLMapper);
xpathText سلسلة نصيّة تُمثّل تعبير XPath المرغوب تجميعه. namespaceURLMapper دالّة تربط سابقة مجال أسماءٍ (namespace prefix) برابط URL مجال أسماءٍ أو القيمة null إن لم يكن ذلك مطلوبًا. القيمة المعادة كائنٌ من النّوع XPathExpression.
Document.onfullscreenchange
الخاصيّة Document.onfullscreenchange مُعالِج أحداثٍ للحدث fullscreenchange الذي يُطلَق عندما يلِج أو يخرج مُستندٌ من وضع ملء الشّاشة. البنية العامة targetDocument.onfullscreenchange = fullscreenChangeHandler;
مثال document.onfullscreenchange = function ( event ) {
console.log("هناك تغيّر في وضع ملء الشّاشة")
};
document.documentElement.onclick = function () {
// يجب استدعاء التّابع
// requestFullscreen()
// داخل مُعالج أحداث لكي لا يفشَل استدعاؤه
document.documentElement.requestFullscreen();
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي 45 47 وراء full-screen-api.unprefix.enabled ؟ ؟ ؟ ...
Document.location
تُعيد الخاصيّة Document.location القابلة للقِراءة فقط كائنًا من النّوع Location، والذي يحتوي على معلومات حول عنوان URL الخاصّ بالمُستند ويُتيح توابع لتعديل عنوان URL هذا وتحميل عنوان URL آخر. ورغم أنّ الخاصيّة Document.location للقِراءة فقط، إلا أنّك تستطيع تعيين سلسلة نصيّة من النّوع DOMString لها كذلك. ما يعني بأنّك تستطيع التّعامل مع هذه الخاصيّة بصفتها سلسلة نصيّة عاديّة في مُعظم الحالات. والسّطران التّاليّان مُتكافئان: document.location = 'http://www.example.com'
document.location.href = 'http://www.example.com'
للحصول على عنوان URL المُستندِ وحده، يُمكنك استعمال الخاصيّة document.URL كذلك. ...
Document.createComment()
يُنشئُ التّابع Document.createComment() عقدةَ تعليق جديدةً ويُعيدها. البنية العامة CommentNode = document.createComment(data)
data سلسلةٌ نصيّة تحتوي على التعليق المرغوب إضافته. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml");
var comment = docu.createComment('هذا تعليق');
docu.getElementsByTagName('xml')[0].appendChild(comment);
alert(new XMLSerializer().serializeToString(docu));
// تعرض
// <xml><!--هذا تعليق--></xml>
مصادر ومواصفات مواصفة createComment
Document.queryCommandEnabled()
يشير التّابع Document.queryCommandEnabled() إلى ما إذا كان أمر التّحرير المعطى مفعّلًا من طرف المتصفّح أم لا. البنية العامة isEnabled = document.queryCommandEnabled(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أو لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مُفعّلًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandEnabled("SelectAll");
if(flg) {
document.execCommand("SelectAll", false, null); // الأمر مُفعّل، لذا نفّذه
}
ملاحظات بالنّسبة للأمران 'cut' و'copy' فإنّ التّابع يعيد القيمة true فقط إن استدعيَ في ...
Document.fullscreenEnabled
تُعيد الخاصية Document.fullscreenEnabled القابلة للقراءة فقط كائنًا من النوع Boolean يُشير إلى ما إذا كان وضع ملء الشاشة مُتاحًا أم لا. وضع ملء الشاشة مُتاح للصفحات التي لا تحتوي على إضافات ذات نوافِذَ في أي من مُستنداتها فقط، وفي حالة كانت جميع عناصر <iframe> التي تحوي المُستند ذات خاصيّة allowfullscreen مضبوطة. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var isFullscreenAvailable ...
Document.dir
الخاصيّة Document.dir خاصيّةٌ من النّوع DOMString تُمثّل اتّجاهيّة النّص في المُستند، إمّا من اليسار إلى اليمين (وهو الخيار الافتراضي) أو من اليمين إلى اليسار. القيَم المُمكنة هي 'rtl' أي من اليمين إلى اليسار، والقيمة 'ltr' التّي تعني من اليسار إلى اليمين. البنية العامة dirStr = document.dir;
document.dir = dirStr;
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم ؟ ؟ مصادر ومواصفات مواصفة HTML Living Standard.
Document.defaultView
في المُتصفحات، تُعيد الخاصيّة Document.defaultView الكائن window المُرتبط بالمستند، أو القيمة null إن لم يكن متوافرًا. البنية العامة var win = document.defaultView;
الخاصيّة قابلة للقراءة فقط. دعم المتصفحات الميزة Chrome Edge Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard. مواصفة HTML5.
Document.exitPointerLock()
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. يُحرّر التّابع Document.exitPointerLock() قفل مؤشّر الفأرة بشكل غير مُتزامنٍ حسب طلبٍ سابقٍ من Element.requestPointerLock. للتحقّق من نجاح أو فشل الطّلب، لابدّ من الاستماع للحدثين pointerlockchange وpointerlockerror. البنية العامة document.exitPointerLock();
دعم المتصفحات الميزة Chrome Edge Firefox Internet Explorer Opera Safari الدعم الأساسي نعم (قد تحتاج إلى السّابقة -webkit في إصدارات قديمة) نعم نعم، مع السّابقة -moz 50 دون سابقة ؟ ؟ ؟ انظر أيضًا Document.pointerLockElement Element.requestPointerLock مصادر ومواصفات ...
Document.head
تُعيد الخاصية document.head العنصر <head> الخاصّ بالمُستند الحالي. إن كان للمُستند أكثر من عنصر <head> واحد، فالقيمة المُعادة ستُمثّل العنصر الأول. البنية العامة var objRef = document.head;
مثال // نضع ما يلي
// في ملفّ
// HTML
// <head id="my-document-head">
var aHead = document.head;
alert(aHead.id); // "my-document-head";
alert( document.head === document.querySelector("head") ); // true
ملاحظات الخاصيّة document.head للقِراءة فقط. مُحاولة ضبط قيمة لها سيفشَل دون أي أخطاء، أو سيرمي خطأ TypeError في مُتصفّح Firefox في حالة كان المستند في نمط strict. دعم المتصفحات الميزة Chrome Edge ...
Document.preferredStyleSheetSet
تُعيد مجموعة صفحات الأنماط المُفضّلة حسب ما ضبطه كاتب الصّفحة. وهي للقراءة فقط. البنية العامّة preferredStyleSheetSet = document.preferredStyleSheetSet
تُشير قيمة المتغيّر preferredStyleSheetSet إلى مجموعة صفحات الأنماط المُفضّلة من طرف كاتب الصّفحة. يُحدَّدُ هذا من خلال ترتيب تعريفات صفحات الأنماط وترويسة HTTP ذات العنوان Default-Style. إن لم تكن هناك مجموعة صفحات أنماط مُفضَّلة من طرف الكاتب، فستكون القيمة المُعادة سلسلةً نصية فارغة (""). مثال if (document.preferredStyleSheetSet) {
console.log("مجموعة صفحات الأنماط المُفضّلة هي:" + document.preferredStyleSheetSet);
} else {
console.log("لا توجد صفحة ...
Document.onselectionchange
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. الخاصيّة Document.onselectionchange مُعالِج أحداثٍ للحدث selectionchange الذي يُطلَق عندما يتغيّر تظليل الكائن. البنية العامة obj.onselectionchange = function;
المُتغيّر function هي دالّة عرّفها المُستخدم user-defined، دون اللاحقة () أو أية مُعاملات، أو تعريفٌ لدالّةٍ مجهولة (anonymous function). مثال document.onselectionchange = function() { console.log("لقد تغيّر التّظليل"); };
دعم المتصفحات الميزة Chrome Internet Explorer Edge Firefox Opera Safari الدعم الأساسي 49 ؟ نعم 45 ؟ ؟ انظر أيضًا selectionchange selectstart ...
Document.timeline
تنبيه: هذه تقنيّة تجريبيّة، انظر جدول دعم المُتصفحات قبل استعمال هذه الخاصيّة في شيفرة إنتاجيّة. تُعيد الخاصيّة القابلة للقراءة فقط timeline المُعرَّفة على الواجهة Document الخطَّ الزمني الافتراضي للمُستند الحالي. هذا الخط الزّمني كائن خاص من النوع DocumentTimeline الذي يُنشأ تلقائيا عند تحميل الصّفحة. الخطّ الزمني فريد لكل مستند ويبقى طيلة مُدّة بقاء المُستند حيًّا، ما يشمل استدعاءات التّابع document.open(). تُحسب القيم الزمنية لهذا الخط الزمني حسب حدّ ثابت (fixed offset) من السّاعة العموميّة بحيث يُكافئ وقتُ الصّفر (zero time) ...
Document.write()
يكتب التّابع Document.write() سلسلةً نصيّةً إلى مجرى (stream) مستندٍ فُتح بالتّابع window.open(). مُلاحظة: لأنّ التّابع Document.write() يكتب إلى مجرى المستند، فاستدعاؤه على مستندٍ مُغلقٍ (مُحمَّل) يستدعي تلقائيًّا التّابع Document.open()، الذي سيحذف محتويات المستند. البنية العامة document.write(markup);
markup سلسلة نصيّة تحتوي على النّص المرغوب كتابته على المستند. مثال <!DOCTYPE html>
<html>
<head>
<title>write مثال</title>
<script>
function newContent() {
alert("تحميل محتوى جديد");
document.open();
document.write("<h1>المحتوى ...
Document.visibilityState
تُعيد الخاصيّة Document.visibilityState القابلة للقراءة فقط حالةَ ظهور المُستند، أي سياق وضوح العنصر الحالي. إذ من المُفيد معرفة ما إذا كان المُستند في الخلفيّة أو في تبويب (لسان، tab) غير مرئي حاليًّا، أو أنّ الصّفحة قد حُمّلت فقط من أجل ما قبل التّصيير (pre-rendering). القيم المُمكنة هي كما يلي: 'visible': تُشير إلى أنّ مُحتويات الصّفحة قد تكون ظاهرة ولو جزئيّا. هذا يعني بأنّ الصفحة موجودة على تبويب أمامي في نافذة غيرِ مُصغّرة. 'hidden': مُحتويات الصّفحة غير واضحة للمستخدم. هذا يعني ...
Document.execCommand()
عندما ينتقل مستند HTML إلى نمط التّصميم designMode فإنّ كائن المستند يوفّر التّابع Document.execCommand() الذي يسمح للمستخدم بتنفيذ الأوامر للتعامل مع محتويات المنطقة القابلة للتّعديل. تؤثّر معظم هذه الأوامر على محتويات المستند الموجودة (تعديل النصوص لجعلها بخط عريض أو مائل مثلًا)، فيما تُدخِل بعض الأوامر الأخرى عناصر جديدة (مثل إضافة رابط) أو تؤثّر على كامل السّطر (مثل إزاحته). عند استخدام الخاصيّة contentEditable، فاستدعاء التّابع Document.execCommand() يؤثّر على العنصر المُفعّل القابل للتعديل حاليًّا. البنية العامة bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)
القيمة ...
Document.enableStyleSheetsForSet()
يفعّل التّابع Document.enableStyleSheetsForSet() صفحات الأنماط التي توافق الاسم المُحدّد في مجموعة صفحات الأنماط الحاليّة، ويُعطّل جميع صفحات الأنماط الأخرى (عَدا تلك التي بدون عنوان، والتي تكون دائمًا مُفعّلة). البنية العامة document.enableStyleSheetsForSet(name)
name اسم صفحات الأنماط المرغوب تفعيلها. ستُفعّل جميع صفحات الأنماط التي توافق هذا الاسم، لكن ستُعطَّل جميع صفحات الأنماط الأخرى التي تملك عنوانًا. مرّر سلسلةً نصيّةً فارغةً لهذا المُعامل لتعطيل جميع صفحات الأنماط البديلة والمُفضّلة (دون صفحات الأنماط الدّائمة التي لا تملك خاصّية title). ملاحظات تُوافَقُ العناوين يكون حسّاسًا ...
Document.hasFocus()
يُعيد التّابع Document.hasFocus() قيمة منطقيّة من النّوع Boolean تدلّ على ما إذا كان المستند أو أي عنصرٍ داخل المستند مُركَّزًا عليه أو لا. يُستعمل هذا التّابع لتحديد ما إذا كان العنصر المفعّل في مستند مُركَّزًا عليه أو لا. ملاحظة: عند عرض مستندٍ ما، فالعنصر المُركّز عليه هو دائمًا العنصر المفعّل في المستند، لكنّ العنصر المفعّل لا يكون دائمًا مُركَّزًا عليه بالضّرورة. على سبيل المثال، عنصر مُفعّل داخل نافذة منبثقة في الخلفيّة لا يكون مركّزًا عليه. البنية العامة focused = document.hasFocus();
...
Document.hidden
تُعيد الخاصيّة Document.hidden قيمة منطقيّة تُشير إلى ما إذا كانت الصّفحة مخفية أم لا. لاحظ أنّ هذه الخاصّية قابلة للقراءة فقط. البنية العامّة var boolean = document.hidden
مثال document.addEventListener("visibilitychange", function() {
console.log( document.hidden );
// افعل شيئا ما
});
دعم المتصفحات الميزة Chrome Firefox Internet Explorer Opera Safari الدعم الأساسي 13 مع السابقة -webkit- ، 33 دون سابقة. 18 10 12.10 7 مصادر ومواصفات مواصفة Page Visibility (Second Edition).
Document.querySelector()
يُعيد التّابع Document.querySelector() أول كائنٍ من النّوع Element الذي يُمثّل العنصر المُوافِق للمُحدِّد أو المحدّدات المعطاة. ويُعيد القيمة null في حالة لم يجِد أيّ عنصر. مُلاحظة: يتمّ البحث باستعمال المرور على العمق أولًا قبل التّرتيب (depth-first pre-order traversal) حول عقد المستند بدايةً من أول عنصر في هيكل المستند ويُكرّر (iterating) حول العقد في القائمة مرتّبةً حسب عدد العقد الأبناء. البنية العامة element = document.querySelector(selectors);
selectors سلسلة نصيّة من النّوع DOMString تحتوي على مُحدّد واحدٍ أو أكثر لمُوافقته مع عناصر المستند ...
Document.scripts
خاصيّة قابلة للقراءة فقط تُعيد جميع عناصر <script> في المُستند. والقيمة المُعادة كائنٌ من النّوع HTMLCollection. البنية العامة var scriptList = document.scripts;
القيمة المُعادة كائنٌ من النّوع HTMLCollection. يُمكنك التّعامل مع المُتغيّر scriptList كما تتعامل مع أي مصفوفة للوصول إلى جميع العناصر في القائمة. مثال المثال التّالي يتحقّق ممّا إذا كان للصّفحة الحاليّة أي عنصر <script>: var scripts = document.scripts;
if (scripts.length) {
alert("هذه الصّفحة تحتوي على سكربتات");
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم ...
Document.writeln()
يكتب التّابع Document.writeln() سلسلةً نصيّةً متبوعةً بمحرف سطرٍ جديدٍ (newline character) على المستند. البنية العامة document.writeln(line);
line سلسلة نصيّة تحتوي على سطر النّص المرغوب إضافته. مثال document.writeln("<p>أدخل كلمة المرور</p>");
ملاحظات التّابع Document.writeln() مشابه للتّابع Document.write() لكنّه يُضيف سطرًا جديدًا. كما هو الحال مع التّابع Document.write() فالتّابع Document.writeln() لا يعمل كذلك في مستندات XHTML، وستحصل على خطأ NS_ERROR_DOM_NOT_SUPPORTED_ERR يفيد بأنّ العمليّة غير مدعومة في سطر أوامر الأخطاء. يحدث هذا عن محاولة فتح ملفّ محليّ ذو الامتداد .xhtml أو أي مستندٍ مُقدَّمٍ ...
Document.plugins
تُعيد الخاصيّة Document.plugins مجموعةً من النّوع HTMLCollection تحتوي على قائمة بجميع عناصر <embed> الموجودة في المُستند الحاليّ. كلّ عنصر في المجموعة يُعدّ من النّوع HTMLEmbedElement، يُمكن أن يكون عدد العناصِر واحدًا أو أكثر، وفي حالة لم يوجَد أي عنصر، فستُعاد القيمة null. مُلاحظة: للحصول على قائمة بالإضافات (plugins) المُنصَّبة، استعمل الخاصيّة NavigatorPlugins.plugins. البنية العامة embedArrayObj = document.plugins
مصادر ومواصفات مواصفة HTML Living Standard
Document.embeds
تُعيد الخاصّية embeds قائمةً بالكائنات المُضمّنة داخل المُستند الحالي. البنية العامة nodeList = document.embeds
مصادر ومواصفات مواصفة HTML Living Standard.
Document.lastModified
تُعيد الخاصية document.lastModified سلسلةً نصيةً تحتوي على تاريخ ووقتِ آخر تعديلٍ للمُستند الحاليّ. البنية العامة string = document.lastModified;
مثال طريقة الاستعمال البسيطة: alert(document.lastModified);
// يُعيد تاريخا مُشابها لما يلي
// 03/22/2018 05:20:48
تحويل قيمة lastModified إلى كائن من النّوع Date: var oLastModif = new Date(document.lastModified);
تحويل قيمة lastModified إلى عدد الأجزاء من ألف جزء من الثّانيّة التّي مرّت منذ 1 يناير 1970 على السّاعة 00:00:00: var nLastModif = Date.parse(document.lastModified);
ملاحظات لاحظ بأنّه لا يُمكن استعمال السّلسة النّصيّة التي تُعيدها الخاصيّة lastModified ...
Document.selectedStyleSheetSet
تُعيد اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا. البنية العامة currentStyleSheetSet = document.selectedStyleSheetSet
document.selectedStyleSheet = newStyleSheetSet
عند الإعادة، سيحمل المتغيّر currentStyleSheetSet اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا، يُمكنك كذلك ضبط مجموعة صفحات الأنماط باستعمال هذه الخاصيّة. ضبط قيمة لهذه الخاصيّة مُكافئٌ لاستدعاء التّابع document.enableStyleSheetsForSet() باستخدام القيمة currentStyleSheetSet، ثمّ ضبط نفس القيمة للخاصية lastStyleSheetSet أيضًا. مُلاحظة: قيمة هذه الخاصيّة حيّة؛ تغيير الخاصيّة disabled على صفحات الأنماط سيُؤثّر على قيمة هذه الخاصيّة. مثال console.log("مجموعة صفحات الأنماط الجاري استعمالها حاليًّا:" + document.selectedStyleSheetSet);
document.selectedStyleSheetSet = ...
Document.designMode
تُستعمل الخاصيّة Document.designMode للتّحكّم فيما إذا أمكن تعديل كامِلِ المُستند أو لا. القيَم الصّالحة هي "on" و"off". وحسب المُواصفة، فالقيمة الافتراضيّة لهذه الخاصّية هي "off"، لكنّ القيمة تكون بأحرفٍ كبيرة (capitalized) في مُتصفّح Internet Explorer. البنية العامة var mode = document.designMode;
document.designMode = "on";
document.designMode = "off";
مثال جعْلُ مُستندِ عنصرِ <iframe> قابلًا للتّعديل: iframeNode.contentDocument.designMode = "on";
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard.
عرض (250 السابقة | 250 التالية) (20 | 50 | 100 | 250 | 500).
يُعرِّف العنصر <td> خليةً في الجدول الذي يحتويها. مثال عن جدول بسيط فيه سطرين وعمودين (عبر عناصر <tr> و <td>): <table>
<tr>
<td>الخلية الأولى في السطر الأول</td>
<td>الخلية الثانية في السطر الأول</td>
</tr>
<tr>
<td>الخلية الأولى في السطر الثاني</td>
<td>الخلية الثانية في السطر الثاني</td>
</tr>
</table>
راجع صفحة العنصر <table> لمزيدٍ من الأمثلة. بطاقة العنصر تصنيفات المحتوى لا يوجد. المحتوى المسموح المحتوى التنظيمي. الوسم المختصر لا ...
العنصر
يُحدِّد العنصر <link> العلاقات بين المستند الحالي وبين مورد خارجي (external resource)؛ من استخدامات هذا الوسم تتضمن تعريف علاقة بين الصفحات للتنقل بينها، بيد أنَّ أكثر استخدامات هذا العنصر شيوعًا هو تضمين صفحات الأنماط. استخدام الشكل الآتي للعنصر <link> لتضمين صفحة أنماط في المستند: <link href="style.css" rel="stylesheet">
بطاقة العنصر تصنيفات المحتوى البيانات الوصفية المحتوى المسموح لا يوجد، فهذا العنصر فارغ. الوسم المختصر لمّا كان هذا العنصر فارغًا، فيجب توفير وسم البداية وحذف وسم النهاية. العناصر الأب أي عنصر يقبل وجود ...
العنصر
يُمثِّل العنصر <button> زرًا قابلًا للضغط. مثال عن استخدام العنصر <button>: <button name="button">اضغط هنا</button>
بطاقة العنصر تصنيفات المحتوى عنصر تنظيمي وعنصر عادي، وعنصر تفاعلي ... المحتوى المسموح المحتوى العادي. الوسم المختصر لا يمكن حذف أيّ من وسمَي البداية أو النهاية. العناصر الأب أي عنصر يقبل المحتوى العادي. واجهة DOM HTMLButtonElement دعم المتصفحات Chrome Firefox Edge Safari Opera مدعوم مدعوم مدعوم مدعوم مدعوم الخاصيات يمكن استخدام الخاصيات العامة في هذا العنصر. autofoucs تسمح لنا هذه الخاصية المنطقية (Boolean) بتحدد أنَّنا نريد ...
العنصر
يُمثِّل العنصر <form> قسمًا في المستند الذي يحتوي على عناصر يستطيع المستخدم التفاعل معها لإرسال بيانات إلى خادوم الويب. مثال بسيط عن نموذج يُرسَل عبر الطريقة GET: <form action="" method="get">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال بسيط عن نموذج يُرسَل عبر الطريقة POST: <form action="" method="post">
<label for="name">الاسم:</label>
<input id="name" type="text" name="name">
<input type="submit" value="أرسل">
</form>
مثال عن نموذج يبيّن استخدام العناصر <fieldset> و <legend> و <label>: <form action="" method="post">
<fieldset>
...
العنصر
يُستعمَل العنصر <video> لتضمين المحتوى المرئي في المستندات، وقد يحتوي على ملف مصدري واحد أو أكثر التي تُمثَّل باستخدام الخاصية src أو عبر العنصر <source>، وسيختار المتصفح أنسب صيغة لتشغيلها. مثال عن استخدام العنصر <video> لإضافة مقطع فيديو بصيغة WebM (عبر الخاصية src) بارتفاع 360، مع عرض عناصر التحكم (عبر الخاصية controls) وله صورة غلاف تُعرَض إلى أن يبدأ تشغيله (الخاصية poster)، وستُعرَض رسالة نصية تنوِّه المستخدم أنَّ متصفحه لا يدعم العنصر <video>: <video src="khamsat.webm" controls poster="khamsat-poster.jpg" height="360">
لا ...
التابع .slideDown() في jQuery
()slideDown. القيم المعادة يعيد كائنًا من النوع jQuery. الوصف يُظهِر هذا التابع جميع العناصر المتطابقة مع حركة انسحابيَّة. .slideDown( [duration ] [, complete ] ) أضيف مع الإصدار 1.0. duration عدد أو سلسلة نصية تمثِّل كمية الوقت الذي ستستغرقه عملية تحريك العنصر، وقيمته الافتراضيَّة هي 400. complete دالةٌ من الشكل Function() وتُستدعَى مرةً وحدةً مع كل عنصر من العناصر المطابقة بعد اكتمال الحركة المطبَّقة عليه. .slideDown( options ) أضيف مع الإصدار: 1.0. Options كائن من النوع Object، وهو مجموعة من ...
التابع .toggle() في jQuery
.toggle( [duration ] [, complete ] ) القيمة المعادة يُعيد كائنًا من النوع jQuery. الوصف يبدِّل هذا التابع حالة العناصر المُطابقة بين العرض و الإخفاء. .toggle( [duration ] [, complete ] ) أُضيف مع الإصدار: 1.0. duration (القيمة الافتراضية: 400) مدة الحركة وهو من النوع عدد Number أو سلسلة نصية String. complete دالة على الشكل Function()، تُستدعى بمجرد اكتمال الحركة، وتُستدعى مرة واحدة لكل عنصر مطابق. .toggle( options ) أُضيف مع الإصدار: 1.0. options كائن من النوع Object، ويقدم مجموعة من ...
Document.getElementsByClassName()
يُعيد التّابع Document.getElementsByClassName() كائنًا مُشابهًا للمصفوفات يحتوي على جميع العناصر الأولاد التي تحمل نفس اسم الصّنف (class name) المُعطى. عند استدعائه على كائن المُستند، فسيُبحَثُ في كامل المُستند، ما يشمل العقدة الجذر. يُمكن كذلك استدعاء التّابع getElementsByClassName() على أي عنصر؛ وسيُعيد العناصر الأولاد للعنصر الجذر المُحدَّد ذات أسماء الأصناف المعطاة. البنية العامة var elements = document.getElementsByClassName(names);
// أو
var elements = rootElement.getElementsByClassName(names);
elements كائنٌ حيّ من النّوع HTMLCollection الذي يُمثّل مجموعة العناصِر التي وُجدت. names سلسلةٌ نصيّةٌ تُمثّل قائمة أسماء الأصناف المرغوب ...
Document.queryCommandSupported()
يشير التّابع Document.queryCommandSupported() إلى ما إذا كان أمر التّحرير المعطى مدعومًا من طرف المتصفّح أم لا. البنية العامة isSupported = document.queryCommandSupported(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أم لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مدعومًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandSupported("SelectAll");
if(flg) {
// نفّذ عمليّةً ما
}
ملاحظات يعيد الأمر 'paste' القيمة false في حالة لم يكن الأمر متاحًا إضافةً إلى حالة كون السكربت المستدعي ...
Document.fullscreenElement
تُعيد الخاصية Document.fullscreenElement القابلة للقراءة فقط العنصر Element الذي في وضع ملء الشاشة حاليًا ضمن عناصر المستند الحالي، أو تُعيد القيمة null في حالة لم يكن وضع ملء الشاشة مُفعلًا. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var element = document.fullscreenElement;
ستكون قيمة المتغيّر element هي إشارةٌ إلى العنصر الموجود في وضع ملء الشاشة حاليًا، أو القيمة null في حالة ...
Document.createCDATASection()
يُنشئُ التّابع Document.createCDATASection() عقدةَ قسم CDATA جديدةً ويُعيدها. البنية العامة CDATASectionNode = document.createCDATASection(data)
CDATASectionNode يُمثّل عقدةً من النّوع CDATASection. data سلسلةٌ نصيّة تحتوي على البيانات المرغوب إضافتها إلى قسم CDATA. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml")
var cdata = docu.createCDATASection('هنا عقدة البيانات');
docu.getElementsByTagName('xml')[0].appendChild(cdata);
alert(new XMLSerializer().serializeToString(docu));
// ستَعرضُ
// <xml><![CDATA[هنا عقدة البيانات]]></xml>
ملاحظات يعمل هذا مع مستندات XML فقط، ولا يعمل مع مستندات HTML (لأنّ مُستندات HTML لا تدعم أقسام CDATA)؛ مُحاولة استعمال التّابع مع مُستندات HTML سترمي الاستثناء NOT_SUPPORTED_ERR. سترمي كذلك الاستثناء NS_ERROR_DOM_INVALID_CHARACTER_ERR ...
Document.createExpression()
يُجمّع التّابع Document.createExpression() استعلام XPathExpression، والذي يُمكن استعماله بعد ذلك لإجراء تقديرات (evaluations) يُمكن تكرارها. البنية العامة xpathExpr = document.createExpression(xpathText, namespaceURLMapper);
xpathText سلسلة نصيّة تُمثّل تعبير XPath المرغوب تجميعه. namespaceURLMapper دالّة تربط سابقة مجال أسماءٍ (namespace prefix) برابط URL مجال أسماءٍ أو القيمة null إن لم يكن ذلك مطلوبًا. القيمة المعادة كائنٌ من النّوع XPathExpression.
Document.onfullscreenchange
الخاصيّة Document.onfullscreenchange مُعالِج أحداثٍ للحدث fullscreenchange الذي يُطلَق عندما يلِج أو يخرج مُستندٌ من وضع ملء الشّاشة. البنية العامة targetDocument.onfullscreenchange = fullscreenChangeHandler;
مثال document.onfullscreenchange = function ( event ) {
console.log("هناك تغيّر في وضع ملء الشّاشة")
};
document.documentElement.onclick = function () {
// يجب استدعاء التّابع
// requestFullscreen()
// داخل مُعالج أحداث لكي لا يفشَل استدعاؤه
document.documentElement.requestFullscreen();
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي 45 47 وراء full-screen-api.unprefix.enabled ؟ ؟ ؟ ...
Document.location
تُعيد الخاصيّة Document.location القابلة للقِراءة فقط كائنًا من النّوع Location، والذي يحتوي على معلومات حول عنوان URL الخاصّ بالمُستند ويُتيح توابع لتعديل عنوان URL هذا وتحميل عنوان URL آخر. ورغم أنّ الخاصيّة Document.location للقِراءة فقط، إلا أنّك تستطيع تعيين سلسلة نصيّة من النّوع DOMString لها كذلك. ما يعني بأنّك تستطيع التّعامل مع هذه الخاصيّة بصفتها سلسلة نصيّة عاديّة في مُعظم الحالات. والسّطران التّاليّان مُتكافئان: document.location = 'http://www.example.com'
document.location.href = 'http://www.example.com'
للحصول على عنوان URL المُستندِ وحده، يُمكنك استعمال الخاصيّة document.URL كذلك. ...
Document.createComment()
يُنشئُ التّابع Document.createComment() عقدةَ تعليق جديدةً ويُعيدها. البنية العامة CommentNode = document.createComment(data)
data سلسلةٌ نصيّة تحتوي على التعليق المرغوب إضافته. مثال var docu = new DOMParser().parseFromString('<xml></xml>', "application/xml");
var comment = docu.createComment('هذا تعليق');
docu.getElementsByTagName('xml')[0].appendChild(comment);
alert(new XMLSerializer().serializeToString(docu));
// تعرض
// <xml><!--هذا تعليق--></xml>
مصادر ومواصفات مواصفة createComment
Document.queryCommandEnabled()
يشير التّابع Document.queryCommandEnabled() إلى ما إذا كان أمر التّحرير المعطى مفعّلًا من طرف المتصفّح أم لا. البنية العامة isEnabled = document.queryCommandEnabled(command);
command الأمر المرغوب التّعرّف على ما إذا كان مدعومًا أو لا. القيمة المعادة قيمة منطقيّة من النّوع Boolean تكون true إن كان الأمر مُفعّلًا وتكون false إن لم يكن كذلك. مثال var flg = document.queryCommandEnabled("SelectAll");
if(flg) {
document.execCommand("SelectAll", false, null); // الأمر مُفعّل، لذا نفّذه
}
ملاحظات بالنّسبة للأمران 'cut' و'copy' فإنّ التّابع يعيد القيمة true فقط إن استدعيَ في ...
Document.fullscreenEnabled
تُعيد الخاصية Document.fullscreenEnabled القابلة للقراءة فقط كائنًا من النوع Boolean يُشير إلى ما إذا كان وضع ملء الشاشة مُتاحًا أم لا. وضع ملء الشاشة مُتاح للصفحات التي لا تحتوي على إضافات ذات نوافِذَ في أي من مُستنداتها فقط، وفي حالة كانت جميع عناصر <iframe> التي تحوي المُستند ذات خاصيّة allowfullscreen مضبوطة. ورغم أن هذه الخاصية قابلة للقراءة فقط، إلا أنّها لن ترمي استثناءً عند تغيير قيمتها (حتى في نمط strict)، وستُتجاهل أية عمليّة ضبط قيمة لها. البنية العامة var isFullscreenAvailable ...
Document.dir
الخاصيّة Document.dir خاصيّةٌ من النّوع DOMString تُمثّل اتّجاهيّة النّص في المُستند، إمّا من اليسار إلى اليمين (وهو الخيار الافتراضي) أو من اليمين إلى اليسار. القيَم المُمكنة هي 'rtl' أي من اليمين إلى اليسار، والقيمة 'ltr' التّي تعني من اليسار إلى اليمين. البنية العامة dirStr = document.dir;
document.dir = dirStr;
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم ؟ ؟ مصادر ومواصفات مواصفة HTML Living Standard.
Document.defaultView
في المُتصفحات، تُعيد الخاصيّة Document.defaultView الكائن window المُرتبط بالمستند، أو القيمة null إن لم يكن متوافرًا. البنية العامة var win = document.defaultView;
الخاصيّة قابلة للقراءة فقط. دعم المتصفحات الميزة Chrome Edge Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard. مواصفة HTML5.
Document.exitPointerLock()
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. يُحرّر التّابع Document.exitPointerLock() قفل مؤشّر الفأرة بشكل غير مُتزامنٍ حسب طلبٍ سابقٍ من Element.requestPointerLock. للتحقّق من نجاح أو فشل الطّلب، لابدّ من الاستماع للحدثين pointerlockchange وpointerlockerror. البنية العامة document.exitPointerLock();
دعم المتصفحات الميزة Chrome Edge Firefox Internet Explorer Opera Safari الدعم الأساسي نعم (قد تحتاج إلى السّابقة -webkit في إصدارات قديمة) نعم نعم، مع السّابقة -moz 50 دون سابقة ؟ ؟ ؟ انظر أيضًا Document.pointerLockElement Element.requestPointerLock مصادر ومواصفات ...
Document.head
تُعيد الخاصية document.head العنصر <head> الخاصّ بالمُستند الحالي. إن كان للمُستند أكثر من عنصر <head> واحد، فالقيمة المُعادة ستُمثّل العنصر الأول. البنية العامة var objRef = document.head;
مثال // نضع ما يلي
// في ملفّ
// HTML
// <head id="my-document-head">
var aHead = document.head;
alert(aHead.id); // "my-document-head";
alert( document.head === document.querySelector("head") ); // true
ملاحظات الخاصيّة document.head للقِراءة فقط. مُحاولة ضبط قيمة لها سيفشَل دون أي أخطاء، أو سيرمي خطأ TypeError في مُتصفّح Firefox في حالة كان المستند في نمط strict. دعم المتصفحات الميزة Chrome Edge ...
Document.preferredStyleSheetSet
تُعيد مجموعة صفحات الأنماط المُفضّلة حسب ما ضبطه كاتب الصّفحة. وهي للقراءة فقط. البنية العامّة preferredStyleSheetSet = document.preferredStyleSheetSet
تُشير قيمة المتغيّر preferredStyleSheetSet إلى مجموعة صفحات الأنماط المُفضّلة من طرف كاتب الصّفحة. يُحدَّدُ هذا من خلال ترتيب تعريفات صفحات الأنماط وترويسة HTTP ذات العنوان Default-Style. إن لم تكن هناك مجموعة صفحات أنماط مُفضَّلة من طرف الكاتب، فستكون القيمة المُعادة سلسلةً نصية فارغة (""). مثال if (document.preferredStyleSheetSet) {
console.log("مجموعة صفحات الأنماط المُفضّلة هي:" + document.preferredStyleSheetSet);
} else {
console.log("لا توجد صفحة ...
Document.onselectionchange
مُلاحظة: هذه الخاصيّة تجريبيّة، انظر جدول دعم المتصفحات قبل استعمالها في شيفرةٍ إنتاجيّة. الخاصيّة Document.onselectionchange مُعالِج أحداثٍ للحدث selectionchange الذي يُطلَق عندما يتغيّر تظليل الكائن. البنية العامة obj.onselectionchange = function;
المُتغيّر function هي دالّة عرّفها المُستخدم user-defined، دون اللاحقة () أو أية مُعاملات، أو تعريفٌ لدالّةٍ مجهولة (anonymous function). مثال document.onselectionchange = function() { console.log("لقد تغيّر التّظليل"); };
دعم المتصفحات الميزة Chrome Internet Explorer Edge Firefox Opera Safari الدعم الأساسي 49 ؟ نعم 45 ؟ ؟ انظر أيضًا selectionchange selectstart ...
Document.timeline
تنبيه: هذه تقنيّة تجريبيّة، انظر جدول دعم المُتصفحات قبل استعمال هذه الخاصيّة في شيفرة إنتاجيّة. تُعيد الخاصيّة القابلة للقراءة فقط timeline المُعرَّفة على الواجهة Document الخطَّ الزمني الافتراضي للمُستند الحالي. هذا الخط الزّمني كائن خاص من النوع DocumentTimeline الذي يُنشأ تلقائيا عند تحميل الصّفحة. الخطّ الزمني فريد لكل مستند ويبقى طيلة مُدّة بقاء المُستند حيًّا، ما يشمل استدعاءات التّابع document.open(). تُحسب القيم الزمنية لهذا الخط الزمني حسب حدّ ثابت (fixed offset) من السّاعة العموميّة بحيث يُكافئ وقتُ الصّفر (zero time) ...
Document.write()
يكتب التّابع Document.write() سلسلةً نصيّةً إلى مجرى (stream) مستندٍ فُتح بالتّابع window.open(). مُلاحظة: لأنّ التّابع Document.write() يكتب إلى مجرى المستند، فاستدعاؤه على مستندٍ مُغلقٍ (مُحمَّل) يستدعي تلقائيًّا التّابع Document.open()، الذي سيحذف محتويات المستند. البنية العامة document.write(markup);
markup سلسلة نصيّة تحتوي على النّص المرغوب كتابته على المستند. مثال <!DOCTYPE html>
<html>
<head>
<title>write مثال</title>
<script>
function newContent() {
alert("تحميل محتوى جديد");
document.open();
document.write("<h1>المحتوى ...
Document.visibilityState
تُعيد الخاصيّة Document.visibilityState القابلة للقراءة فقط حالةَ ظهور المُستند، أي سياق وضوح العنصر الحالي. إذ من المُفيد معرفة ما إذا كان المُستند في الخلفيّة أو في تبويب (لسان، tab) غير مرئي حاليًّا، أو أنّ الصّفحة قد حُمّلت فقط من أجل ما قبل التّصيير (pre-rendering). القيم المُمكنة هي كما يلي: 'visible': تُشير إلى أنّ مُحتويات الصّفحة قد تكون ظاهرة ولو جزئيّا. هذا يعني بأنّ الصفحة موجودة على تبويب أمامي في نافذة غيرِ مُصغّرة. 'hidden': مُحتويات الصّفحة غير واضحة للمستخدم. هذا يعني ...
Document.execCommand()
عندما ينتقل مستند HTML إلى نمط التّصميم designMode فإنّ كائن المستند يوفّر التّابع Document.execCommand() الذي يسمح للمستخدم بتنفيذ الأوامر للتعامل مع محتويات المنطقة القابلة للتّعديل. تؤثّر معظم هذه الأوامر على محتويات المستند الموجودة (تعديل النصوص لجعلها بخط عريض أو مائل مثلًا)، فيما تُدخِل بعض الأوامر الأخرى عناصر جديدة (مثل إضافة رابط) أو تؤثّر على كامل السّطر (مثل إزاحته). عند استخدام الخاصيّة contentEditable، فاستدعاء التّابع Document.execCommand() يؤثّر على العنصر المُفعّل القابل للتعديل حاليًّا. البنية العامة bool = document.execCommand(aCommandName, aShowDefaultUI, aValueArgument)
القيمة ...
Document.enableStyleSheetsForSet()
يفعّل التّابع Document.enableStyleSheetsForSet() صفحات الأنماط التي توافق الاسم المُحدّد في مجموعة صفحات الأنماط الحاليّة، ويُعطّل جميع صفحات الأنماط الأخرى (عَدا تلك التي بدون عنوان، والتي تكون دائمًا مُفعّلة). البنية العامة document.enableStyleSheetsForSet(name)
name اسم صفحات الأنماط المرغوب تفعيلها. ستُفعّل جميع صفحات الأنماط التي توافق هذا الاسم، لكن ستُعطَّل جميع صفحات الأنماط الأخرى التي تملك عنوانًا. مرّر سلسلةً نصيّةً فارغةً لهذا المُعامل لتعطيل جميع صفحات الأنماط البديلة والمُفضّلة (دون صفحات الأنماط الدّائمة التي لا تملك خاصّية title). ملاحظات تُوافَقُ العناوين يكون حسّاسًا ...
Document.hasFocus()
يُعيد التّابع Document.hasFocus() قيمة منطقيّة من النّوع Boolean تدلّ على ما إذا كان المستند أو أي عنصرٍ داخل المستند مُركَّزًا عليه أو لا. يُستعمل هذا التّابع لتحديد ما إذا كان العنصر المفعّل في مستند مُركَّزًا عليه أو لا. ملاحظة: عند عرض مستندٍ ما، فالعنصر المُركّز عليه هو دائمًا العنصر المفعّل في المستند، لكنّ العنصر المفعّل لا يكون دائمًا مُركَّزًا عليه بالضّرورة. على سبيل المثال، عنصر مُفعّل داخل نافذة منبثقة في الخلفيّة لا يكون مركّزًا عليه. البنية العامة focused = document.hasFocus();
...
Document.hidden
تُعيد الخاصيّة Document.hidden قيمة منطقيّة تُشير إلى ما إذا كانت الصّفحة مخفية أم لا. لاحظ أنّ هذه الخاصّية قابلة للقراءة فقط. البنية العامّة var boolean = document.hidden
مثال document.addEventListener("visibilitychange", function() {
console.log( document.hidden );
// افعل شيئا ما
});
دعم المتصفحات الميزة Chrome Firefox Internet Explorer Opera Safari الدعم الأساسي 13 مع السابقة -webkit- ، 33 دون سابقة. 18 10 12.10 7 مصادر ومواصفات مواصفة Page Visibility (Second Edition).
Document.querySelector()
يُعيد التّابع Document.querySelector() أول كائنٍ من النّوع Element الذي يُمثّل العنصر المُوافِق للمُحدِّد أو المحدّدات المعطاة. ويُعيد القيمة null في حالة لم يجِد أيّ عنصر. مُلاحظة: يتمّ البحث باستعمال المرور على العمق أولًا قبل التّرتيب (depth-first pre-order traversal) حول عقد المستند بدايةً من أول عنصر في هيكل المستند ويُكرّر (iterating) حول العقد في القائمة مرتّبةً حسب عدد العقد الأبناء. البنية العامة element = document.querySelector(selectors);
selectors سلسلة نصيّة من النّوع DOMString تحتوي على مُحدّد واحدٍ أو أكثر لمُوافقته مع عناصر المستند ...
Document.scripts
خاصيّة قابلة للقراءة فقط تُعيد جميع عناصر <script> في المُستند. والقيمة المُعادة كائنٌ من النّوع HTMLCollection. البنية العامة var scriptList = document.scripts;
القيمة المُعادة كائنٌ من النّوع HTMLCollection. يُمكنك التّعامل مع المُتغيّر scriptList كما تتعامل مع أي مصفوفة للوصول إلى جميع العناصر في القائمة. مثال المثال التّالي يتحقّق ممّا إذا كان للصّفحة الحاليّة أي عنصر <script>: var scripts = document.scripts;
if (scripts.length) {
alert("هذه الصّفحة تحتوي على سكربتات");
}
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم ...
Document.writeln()
يكتب التّابع Document.writeln() سلسلةً نصيّةً متبوعةً بمحرف سطرٍ جديدٍ (newline character) على المستند. البنية العامة document.writeln(line);
line سلسلة نصيّة تحتوي على سطر النّص المرغوب إضافته. مثال document.writeln("<p>أدخل كلمة المرور</p>");
ملاحظات التّابع Document.writeln() مشابه للتّابع Document.write() لكنّه يُضيف سطرًا جديدًا. كما هو الحال مع التّابع Document.write() فالتّابع Document.writeln() لا يعمل كذلك في مستندات XHTML، وستحصل على خطأ NS_ERROR_DOM_NOT_SUPPORTED_ERR يفيد بأنّ العمليّة غير مدعومة في سطر أوامر الأخطاء. يحدث هذا عن محاولة فتح ملفّ محليّ ذو الامتداد .xhtml أو أي مستندٍ مُقدَّمٍ ...
Document.plugins
تُعيد الخاصيّة Document.plugins مجموعةً من النّوع HTMLCollection تحتوي على قائمة بجميع عناصر <embed> الموجودة في المُستند الحاليّ. كلّ عنصر في المجموعة يُعدّ من النّوع HTMLEmbedElement، يُمكن أن يكون عدد العناصِر واحدًا أو أكثر، وفي حالة لم يوجَد أي عنصر، فستُعاد القيمة null. مُلاحظة: للحصول على قائمة بالإضافات (plugins) المُنصَّبة، استعمل الخاصيّة NavigatorPlugins.plugins. البنية العامة embedArrayObj = document.plugins
مصادر ومواصفات مواصفة HTML Living Standard
Document.embeds
تُعيد الخاصّية embeds قائمةً بالكائنات المُضمّنة داخل المُستند الحالي. البنية العامة nodeList = document.embeds
مصادر ومواصفات مواصفة HTML Living Standard.
Document.lastModified
تُعيد الخاصية document.lastModified سلسلةً نصيةً تحتوي على تاريخ ووقتِ آخر تعديلٍ للمُستند الحاليّ. البنية العامة string = document.lastModified;
مثال طريقة الاستعمال البسيطة: alert(document.lastModified);
// يُعيد تاريخا مُشابها لما يلي
// 03/22/2018 05:20:48
تحويل قيمة lastModified إلى كائن من النّوع Date: var oLastModif = new Date(document.lastModified);
تحويل قيمة lastModified إلى عدد الأجزاء من ألف جزء من الثّانيّة التّي مرّت منذ 1 يناير 1970 على السّاعة 00:00:00: var nLastModif = Date.parse(document.lastModified);
ملاحظات لاحظ بأنّه لا يُمكن استعمال السّلسة النّصيّة التي تُعيدها الخاصيّة lastModified ...
Document.selectedStyleSheetSet
تُعيد اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا. البنية العامة currentStyleSheetSet = document.selectedStyleSheetSet
document.selectedStyleSheet = newStyleSheetSet
عند الإعادة، سيحمل المتغيّر currentStyleSheetSet اسم مجموعة صفحات الأنماط الجاري استعمالها حاليًّا، يُمكنك كذلك ضبط مجموعة صفحات الأنماط باستعمال هذه الخاصيّة. ضبط قيمة لهذه الخاصيّة مُكافئٌ لاستدعاء التّابع document.enableStyleSheetsForSet() باستخدام القيمة currentStyleSheetSet، ثمّ ضبط نفس القيمة للخاصية lastStyleSheetSet أيضًا. مُلاحظة: قيمة هذه الخاصيّة حيّة؛ تغيير الخاصيّة disabled على صفحات الأنماط سيُؤثّر على قيمة هذه الخاصيّة. مثال console.log("مجموعة صفحات الأنماط الجاري استعمالها حاليًّا:" + document.selectedStyleSheetSet);
document.selectedStyleSheetSet = ...
Document.designMode
تُستعمل الخاصيّة Document.designMode للتّحكّم فيما إذا أمكن تعديل كامِلِ المُستند أو لا. القيَم الصّالحة هي "on" و"off". وحسب المُواصفة، فالقيمة الافتراضيّة لهذه الخاصّية هي "off"، لكنّ القيمة تكون بأحرفٍ كبيرة (capitalized) في مُتصفّح Internet Explorer. البنية العامة var mode = document.designMode;
document.designMode = "on";
document.designMode = "off";
مثال جعْلُ مُستندِ عنصرِ <iframe> قابلًا للتّعديل: iframeNode.contentDocument.designMode = "on";
دعم المتصفحات الميزة Chrome Internet Explorer Firefox Opera Safari الدعم الأساسي نعم نعم نعم نعم نعم مصادر ومواصفات مواصفة HTML Living Standard.
عرض (250 السابقة | 250 التالية) (20 | 50 | 100 | 250 | 500).