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

本文主要是介绍加油优惠价格计算-课后程序(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代码来实现这一效果,具体代码如下:

  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="UTF-8">
  5.         <title>加油优惠价格计算</title>
  6.     </head>
  7.     <body>
  8.         <script type="text/javascript">
  9.         var number = prompt("请输入汽油编号");
  10.         var liters = prompt("请输入你要加多少升");
  11.         if(number == "92"){
  12.            if(liters >= 20){
  13.                document.write('汽油5.9元一升;'+ '<br/>' +'共计:'+ (5.9*liters)+'');
  14.            }
  15.            else {
  16.                document.write('汽油6元一升;'+ '<br/>' +'共计:'+ (6*liters)+'');
  17.            }
  18.         }
  19.         else if(number == "97")  {
  20.            if(liters >= 40) {
  21.                document.write('汽油6.5元一升;'+ '<br/>' +'共计:'+ (6.5*liters)+'');
  22.            }
  23.            else {
  24.                document.write('汽油7元一升;'+ '<br/>' +'共计:'+ (7*liters)+'');
  25.            }
  26.         }
  27.         else {
  28.            alert("您输入的汽油我没见过");
  29.         }
  30.         </script>
  31.     </body>
  32. </html>

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

这篇关于加油优惠价格计算-课后程序(JavaScript前端开发案例教程-黑马程序员编著-第2章-课后作业)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/288850

相关文章

Java实现字符串大小写转换的常用方法

《Java实现字符串大小写转换的常用方法》在Java中,字符串大小写转换是文本处理的核心操作之一,Java提供了多种灵活的方式来实现大小写转换,适用于不同场景和需求,本文将全面解析大小写转换的各种方法... 目录前言核心转换方法1.String类的基础方法2. 考虑区域设置的转换3. 字符级别的转换高级转换

HTML5的input标签的`type`属性值详解和代码示例

《HTML5的input标签的`type`属性值详解和代码示例》HTML5的`input`标签提供了多种`type`属性值,用于创建不同类型的输入控件,满足用户输入的多样化需求,从文本输入、密码输入、... 目录一、引言二、文本类输入类型2.1 text2.2 password2.3 textarea(严格

SpringBoot简单整合ElasticSearch实践

《SpringBoot简单整合ElasticSearch实践》Elasticsearch支持结构化和非结构化数据检索,通过索引创建和倒排索引文档,提高搜索效率,它基于Lucene封装,分为索引库、类型... 目录一:ElasticSearch支持对结构化和非结构化的数据进行检索二:ES的核心概念Index:

Java方法重载与重写之同名方法的双面魔法(最新整理)

《Java方法重载与重写之同名方法的双面魔法(最新整理)》文章介绍了Java中的方法重载Overloading和方法重写Overriding的区别联系,方法重载是指在同一个类中,允许存在多个方法名相同... 目录Java方法重载与重写:同名方法的双面魔法方法重载(Overloading):同门师兄弟的不同绝

Spring配置扩展之JavaConfig的使用小结

《Spring配置扩展之JavaConfig的使用小结》JavaConfig是Spring框架中基于纯Java代码的配置方式,用于替代传统的XML配置,通过注解(如@Bean)定义Spring容器的组... 目录JavaConfig 的概念什么是JavaConfig?为什么使用 JavaConfig?Jav

Java数组动态扩容的实现示例

《Java数组动态扩容的实现示例》本文主要介绍了Java数组动态扩容的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧... 目录1 问题2 方法3 结语1 问题实现动态的给数组添加元素效果,实现对数组扩容,原始数组使用静态分配

Java中ArrayList与顺序表示例详解

《Java中ArrayList与顺序表示例详解》顺序表是在计算机内存中以数组的形式保存的线性表,是指用一组地址连续的存储单元依次存储数据元素的线性结构,:本文主要介绍Java中ArrayList与... 目录前言一、Java集合框架核心接口与分类ArrayList二、顺序表数据结构中的顺序表三、常用代码手动

JAVA项目swing转javafx语法规则以及示例代码

《JAVA项目swing转javafx语法规则以及示例代码》:本文主要介绍JAVA项目swing转javafx语法规则以及示例代码的相关资料,文中详细讲解了主类继承、窗口创建、布局管理、控件替换、... 目录最常用的“一行换一行”速查表(直接全局替换)实际转换示例(JFramejs → JavaFX)迁移建

Spring Boot Interceptor的原理、配置、顺序控制及与Filter的关键区别对比分析

《SpringBootInterceptor的原理、配置、顺序控制及与Filter的关键区别对比分析》本文主要介绍了SpringBoot中的拦截器(Interceptor)及其与过滤器(Filt... 目录前言一、核心功能二、拦截器的实现2.1 定义自定义拦截器2.2 注册拦截器三、多拦截器的执行顺序四、过

JAVA线程的周期及调度机制详解

《JAVA线程的周期及调度机制详解》Java线程的生命周期包括NEW、RUNNABLE、BLOCKED、WAITING、TIMED_WAITING和TERMINATED,线程调度依赖操作系统,采用抢占... 目录Java线程的生命周期线程状态转换示例代码JAVA线程调度机制优先级设置示例注意事项JAVA线程