مشكلة في إستعمال else if في javascript عمل شرط للتأكد من أن قيمة محصورة ضمن مجال

السلام عليكم.

أنا بصدد بكتابة كود تقييمي.

التقييم يظههر من خلال عدد النجمات.

مثلا: التقييم 5 يظهر 5 نجمات

التقييم 3.2 يظهر 3 نجمات و نصف نجمة.

الكود:

// adding the rate

let rate = (customer.rating * 100)/5;



if (rate <= 10){

  customersCardRate.innerHTML = `<i class="fa-solid fa-star-half-stroke"></i>`



}

else if( 11 <= rate <= 20) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>`



}

else if (21 <= rate <= 30) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star-half-stroke"></i>`



}

else if (31 <= rate <= 40) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>`



}

else if (41 <= rate <= 50) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star-half-stroke"></i>`



}

else if (51 <= rate <= 60) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>`



}

else if (61 <= rate <= 70) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star-half-stroke"></i>`



}

else if (71 <= rate <= 80) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>`



}

else if (81 <= rate <= 90) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star-half-stroke"></i>`



}

else if (91 <= rate <= 100) {

  customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>

<i class="fa-solid fa-star"></i>`

}

المشكلة هو أن الكود يقف مباشرة بعد if الأولى.

يعني يظهر مباشرة نجمة واحدة.

عندما أضع else if التي تليها في شكل comment يمر مباشرة للتي تليها.

شكرا لكم.

بتاريخ 8 دقائق مضت قال محمود سعداوي:

السلام عليكم.

أنا بصدد بكتابة كود تقييمي.

التقييم يظههر من خلال عدد النجمات.

مثلا: التقييم 5 يظهر 5 نجمات

التقييم 3.2 يظهر 3 نجمات و نصف نجمة.

الكود:

 

    // adding the rate

    let rate = (customer.rating * 100)/5;

 

    if (rate <= 10){

        customersCardRate.innerHTML = `<i class="fa-solid fa-star-half-stroke"></i>`

 

    }

    else if( 11 <= rate <= 20) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>`

 

    }

    else if (21 <= rate <= 30) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star-half-stroke"></i>`

 

    }

    else if (31 <= rate <= 40) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

         <i class="fa-solid fa-star"></i>`

 

    }

    else if (41 <= rate <= 50) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star-half-stroke"></i>`

 

    }

    else if (51 <= rate <= 60) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>`

 

    }

    else if (61 <= rate <= 70) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star-half-stroke"></i>`

 

    }

    else if (71 <= rate <= 80) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>`

 

    }

    else if (81 <= rate <= 90) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star-half-stroke"></i>`

 

    }

    else if (91 <= rate <= 100) {

        customersCardRate.innerHTML = `<i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>

        <i class="fa-solid fa-star"></i>`

    }

المشكلة هو أن الكود يقف مباشرة بعد if الأولى.

يعني يظهر مباشرة نجمة واحدة.

عندما أضع else if التي تليها في شكل comment يمر مباشرة للتي تليها.

شكرا لكم.

 

ملاحظة: console لايظهر أي أخطاء