Script #8 نوافذ التفاعل مع المستخدم

السلام عليكم

هدف سكربت اليوم هو التعامل مع أنواع النوافذ الثلاثة في جافاسكربت

سنقوم بإنشاء تطبيق بسيط يقوم بالترحيب بالزائر وسؤاله عن اسمه، وسنجعل الـtitle الخاص بالصفحة هو اسم الشخص، ثم سنسأله هل أعجبه ذلك، ونعرض أخيرًا نافذة تحوي رسالة حسب رأي المستخدم (رسالة1 إن أعجبه، ورسالة 2 إن لم يعجبه)

أجزاء السكربت الرئيسية

1- الوصول إلى عنوان (title) الصفحة

document.getElementsByTagName("title")[0].innerHTML

أو عن طريق:

document.querySelector("title").innerHTML

2- نافذة الحوار prompt

نستخدم التابع prompt الذي يأخذ وسيطين، أولهما هو العبارة التي تمثّل السّؤال للمستخدم، وثانيهما هو النّص الافتراضي الذي يكون في مكان تحرير النص

ويعيد هذا التابع سلسلةنصية تمثل النص الذي كتبه المستخدم

var txt=prompt("Hello friend, What is your name?","your name");

3- نافذة السؤال confirm

سنستخدم التابع confirm لسؤال المستخدم إن كان أعجبه وجود اسمه على العنوان، وهو تابع يأخذ وسيطًا هو العبارة التي ستظهر للمستخدم، ويعيد true إن اختار المستخدم OK أو false إن اختار المستخدم cancel

var answer=confirm("Did you like that your name has became the 'title'?")

4- نافذة التنبيه alert

نمرر لها وسيطًا هو الرسالة التي ستظهر للمستخدم، ولا يتيح إلى زر OK

نصّ السكربت

var txt=prompt("Hello friend, What is your name?","your name");
document.querySelector("title").innerHTML=txt
var answer=confirm("Did you like that your name has became the 'title'")
alert(answer?"Thanks for visiting":"Sorry for bothering")

لاحظ استخدام معامل الشرط الثلاثي الّذي يقوم بتنفيذ العبارة بعد؟ إن تحقق الشرط الذي قبل؟ أو يقوم بتنفيذ العبارة التي بعد : غن لم يتحقق الشرط.

المرجع:

والله وليّ التوفيق