logo

تحميل جافا سكريبت

في JavaScript، يمكن تطبيق هذا الحدث لتشغيل وظيفة معينة عند عرض الصفحة بالكامل. ويمكن استخدامه أيضًا للتحقق من نوع وإصدار متصفح الزائر. يمكننا التحقق من ملفات تعريف الارتباط التي تستخدمها الصفحة باستخدام تحميل يصف.

في HTML، يتم تشغيل السمة onload عند تحميل كائن ما. الغرض من هذه السمة هو تنفيذ برنامج نصي عند تحميل العنصر المرتبط.

في HTML، تحميل يتم استخدام السمة بشكل عام مع عنصر لتنفيذ برنامج نصي بمجرد تحميل محتوى صفحة الويب بالكامل (بما في ذلك ملفات CSS والصور والبرامج النصية وما إلى ذلك). ليس من الضروري استخدامه مع العلامة فقط، حيث يمكن استخدامه مع عناصر HTML الأخرى.

الفرق بين document.onload و window.onload يكون: document.onload مشغلات قبل تحميل الصور والمحتويات الخارجية الأخرى. يتم إطلاقه قبل window.onload . بينما ال window.onload يتم تشغيله عند تحميل الصفحة بأكملها، بما في ذلك ملفات CSS وملفات البرامج النصية والصور وما إلى ذلك.

regexp_like في الخلية

بناء الجملة

 window.onload = fun() 

دعونا نفهم هذا الحدث باستخدام بعض الأمثلة.

دي دي إل مقابل دي إم إل

مثال 1

في هذا المثال، يوجد عنصر div بارتفاع 200 بكسل وعرض 200 بكسل. وهنا نستخدم نافذة.عند التحميل() لتغيير لون الخلفية وعرضها وارتفاعها شعبة العنصر بعد تحميل صفحة الويب.

تم ضبط لون الخلفية على 'أحمر' ، وتم ضبط العرض والارتفاع على 300 بكسل كل.

 window.onload() #bg{ width: 200px; height: 200px; border: 4px solid blue; } window.onload = function(){ document.getElementById(&apos;bg&apos;).style.backgroundColor = &apos;red&apos;; document.getElementById(&apos;bg&apos;).style.width = &apos;300px&apos;; document.getElementById(&apos;bg&apos;).style.height = &apos;300px&apos;; } <h2> This is an example of window.onload() </h2> 
اختبره الآن

انتاج |

بعد تنفيذ الكود وتحميل الصفحة سيكون الناتج -

تحميل جافا سكريبت

مثال2

في هذا المثال، نقوم بتنفيذ رسم متحرك بسيط باستخدام خصائص كائن DOM ووظائفه جافا سكريبت . نحن نستخدم ال وظيفة جافا سكريبت getElementById() للحصول على كائن DOM ثم تعيين هذا الكائن إلى متغير عام.

array.from جافا
 var img = null; function init(){ img = document.getElementById(&apos;myimg&apos;); img.style.position = &apos;relative&apos;; img.style.left = &apos;50px&apos;; } function moveRight(){ img.style.left = parseInt( img.style.left) + 100 + &apos;px&apos;; } window.onload = init; <p>Click the below button to move the image right</p> 
اختبره الآن

انتاج |

بعد التنفيذ الناجح للكود أعلاه، سيكون الإخراج -

تحميل جافا سكريبت

والآن، هناك مثال سنستخدم فيه HTML تحميل السمة ووظائف جافا سكريبت.

مثال3

إنه مثال بسيط لاستخدام HTML تحميل السمة مع الوظيفة المحددة في JavaScript. في هذا المثال، يُحذًِر() يتم استدعاء الوظيفة عند تحديث المستند.

 function fun() { alert(&apos;Hello World!!, Welcome to the javaTpoint.com&apos;); } <p> Try to refresh the document to see the effect. </p> 
اختبره الآن

انتاج |

ما هو الخروج svn

بعد تنفيذ الكود أعلاه سيكون الناتج -

تحميل جافا سكريبت