Bootstrap

综合案例--查询水果价格

 

目录

 

一.案例要求

二.设计思路

三.案例结果展示

四.源代码展示


一.案例要求

        用户在弹出框里面输出一个水果名称,如果里面包含这个水果则弹出这个水果的价格,如果没有就弹出“没有此水果”。

二.设计思路

        1.首先利用prompt弹出一个输入框,用来给用户输入水果名称。

        2.接着设置一个变量来保存这个水果名称的值。

        3.将这个变量作为switch语句括号里面的表达式。

        4.接着在case后面列出几种水果的名称,注意一定要加单引号,否则会匹配不成功。

        5.在所列出的几种水果后面加上对应的alert弹出框,弹出不同的价格。

三.案例结果展示

        

        

 

这只是查询的苹果价格,如果我们需要查询其他水果价格,只需要输入对应的水果名称就可以查询到相应的价格。

四.源代码展示

       

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script>
    var fruit=prompt('请输入要查询的水果:')
    switch(fruit){
      case '苹果':alert('苹果的价格为 5.5元/斤');
                  break;
      case '香蕉':alert('香蕉的价格为 10元/斤');
                  break;
      case '榴莲':alert('榴莲的价格为 30元/斤');
                  break;
      default:alert('没有此水果');
                  break;
    }
  </script>
</head>
<body>
  
</body>
</html>

 

悦读

道可道,非常道;名可名,非常名。 无名,天地之始,有名,万物之母。 故常无欲,以观其妙,常有欲,以观其徼。 此两者,同出而异名,同谓之玄,玄之又玄,众妙之门。

;