加油优惠价格计算-课后程序(JavaScript前端开发案例教程-黑马程序员编著-第2章-课后作业)

【案例2-2】 加油优惠价格计算

一、案例描述

1. 考核知识点

if 、 if…else 、if…else if…else

1. 练习目标

• 掌握if单分支语句。
• 掌握if…else双分支语句
• 掌握if…else if…else多分支语句
  1. 需求分析

  加油站，为了鼓励车主多加油，实行多加多优惠政策，具体优惠如下：

  • 已知92号汽油，每升6元；如果大于等于20升，那么每升5.9；
  • 已知97号汽油，每升7元；如果大于等于40升，那么每升6.5
  • 编写JS程序，用户输入自己的汽油编号，然后输入自己加多少升，弹出价格
    1. 案例分析
    1. 效果如图2-2、2-3、2-4所示。

    

     

    1. 输入汽油编号

    

     

    
    （图片来源网络，侵删）
    1. 输入油量

    

     

    1. 页面输出单价和总价钱
    1. 具体实现步骤如下：
    1. 输入汽油编号。
    2. 输入想要加的油量。
    3. 根据编号和油量来规定单价、计算总价
    4. 页面中输出单价和总价钱

    二、案例实现

    根据上面的分析，可以通过简单的JavaScript代码来实现这一效果，具体代码如下：

    
    （图片来源网络，侵删）
    3.    
    4.        
    5.         加油优惠价格计算
    6.    
    7.    
    8.        
    9.         var number = prompt("请输入汽油编号");
    10.         var liters = prompt("请输入你要加多少升");
    11.         if(number == "92"){
    12.            if(liters >= 20){
    13.                document.write('汽油5.9元一升;'+ '
        ' +'共计:'+ (5.9*liters)+'元');
    14.            }
    15.            else {
    16.                document.write('汽油6元一升;'+ '
        ' +'共计:'+ (6*liters)+'元');
    17.            }
    18.         }
    19.         else if(number == "97")  {
    20.            if(liters >= 40) {
    21.                document.write('汽油6.5元一升;'+ '
        ' +'共计:'+ (6.5*liters)+'元');
    22.            }
    23.            else {
    24.                document.write('汽油7元一升;'+ '
        ' +'共计:'+ (7*liters)+'元');
    25.            }
    26.         }
    27.         else {
    28.            alert("您输入的汽油我没见过");
    29.         }
    30.        
    31.    

    保存后，在谷歌浏览器中预览，效果如图2-2、2-3、2-4所示。