جافاسكربتالنوافذ المنبثقة

// btn في متغير إسمه btn يساوي id هنا قمنا بتخزين العنصر الذي يملك
var btn = document.getElementById('myBtn');

// btn هنا حددنا أنه سيتم إظهار نافذة تنبيه منبثقة عند النقر على العنصر الذي يمثله المتغير
btn.addEventListener('click', () => {
     alert('Click ok to continue');
});

// btn في متغير إسمه btn يساوي id هنا قمنا بتخزين العنصر الذي يملك
var btn = document.getElementById('btn');

// result في متغير إسمه result يساوي id هنا قمنا بتخزين العنصر الذي يملك
var result = document.getElementById('result');

// btn هنا قمنا بتحديد ما سيحدث عند النقر على الزر الذي يمثله المتغير
btn.addEventListener('click', () => {
    // choice أولاً سيتم إظهار نافذة للموافقة و عند إغلاقها سيتم تخزين القرار في المتغير 
    let choice = confirm('Are you sure?');

    // result سيتم وضع نص يشير إلى الموافقة في العنصر true تساوي result إذا كانت قيمة
    if(choice) {
       result.innerHTML = 'You clicked OK';
    }
    // result سيتم وضع نص يشير إلى الرفض في العنصر false تساوي result إذا كانت قيمة
    else {
       result.innerHTML = 'You clicked CANCEL';
    }
});

// btn في متغير إسمه btn يساوي id هنا قمنا بتخزين العنصر الذي يملك
var btn = document.getElementById('btn');

// result في متغير إسمه result يساوي id هنا قمنا بتخزين العنصر الذي يملك
var result = document.getElementById('result');

// btn هنا قمنا بتحديد ما سيحدث عند النقر على الزر الذي يمثله المتغير
btn.addEventListener('click', () => {
    // text أولاً سيتم إظهار نافذة لإدخال قيمة و عند إغلاقها سيتم تخزين القيمة في المتغير 
    let text = prompt('Leave a review', 'I like it!');

    // result فهذا يعني أنه نقر على زر الرجوع و سيتم وضع نص يشير لذلك في العنصر null تساوي text إذا كانت قيمة
    if(text == null) {
       result.innerHTML = 'You clicked CANCEL';
    }
    // result عبارة عن نص فارغ فهذ يعني أنه نقر على زر الموافقة و لكنه لم يدخل أي قيمة و سيتم وضع نص يشير لذلك في العنصر text إذا كانت قيمة
    else if(text == '') {
       result.innerHTML = 'You clicked OK, but you did not enter any text.';
    }
    // result إذا لم يتحقق أي شرط سابق فهذا يعني أن المستخدم قام بإدخال قيمة و سيتم عرضها في العنصر
    else {
       result.innerHTML = text;
    }
});

// btn في متغير إسمه btn يساوي id هنا قمنا بتخزين العنصر الذي يملك
var btn = document.getElementById('btn');

// value في متغير إسمه value يساوي id هنا قمنا بتخزين العنصر الذي يملك
var value = document.getElementById('value');

// btn هنا قمنا بتحديد ما سيحدث عند النقر على الزر الذي يمثله المتغير
btn.addEventListener('click', () => {
    // أولاً سيتم إظهار نافذة تطلب من المستخدم إدخال عدد و عند إغلاقها سيتم محاولة
    // x تحويل ما أدخله المستخدم إلى عدد صحيح و من ثم سيتم تخزينه في المتغير
    let x = parseInt(prompt('Enter a number:'));

    // فهذا يعني أن القيمة التي أدخلها المستخدم لم تكن عددية و لهذا فشل تحويلها NaN تساوي x إذا كانت قيمة
    if(isNaN(x)) {
        // إلى قيمة عددية فشلت x يخبر المستخدم بأن عملية تحويل قيمة value هنا سيتم وضع في العنصر
       value.innerHTML = 'Failed to convert X value to integer.';
    }
    // value إذا لم يتحقق الشرط السابق فهذا يعني أن المستخدم قام بإدخال قيمة عددية و سيتم عرضها في العنصر
    else {
       value.innerHTML = 'X contain an integer value = ' + x;
    }
});

// btn في متغير إسمه btn يساوي id هنا قمنا بتخزين العنصر الذي يملك
var btn = document.getElementById('myBtn');

// btn هنا حددنا أنه سيتم إظهار نافذة تنبيه منبثقة عند النقر على العنصر الذي يمثله المتغير
// الموضوع في النص، يجعل مفسر الكود يفهم أنه يجب عرض المحتوى التالي بعده على سطر جديد \n الرمز
btn.addEventListener('click', () => {
     alert('First Line.\nSecond Line.');
});