Untitled

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        img {
  display: none;}
        </style>
    <script>
 
   function change(){
    var nodo = document.getElementById("change");
    nodo.style.color = "red";
 
 
 
   }
   function change1(){
    var nodo = document.getElementById("car");
    nodo.style.display = "block";
 
 
 
   }
   function scelta(){
 
    var scelta = document.getElementById("cars").value;
    var nodo = document.getElementById("result");
    nodo.textContent = "Hai scelto: " + scelta; 
    var prezzo = 0;
    var nodoPrezzo = document.getElementById("prezzo");
    
 
    if (scelta == "volvo") {
        var nodo = document.getElementById("volvo");
    nodo.style.display = "block";
    var nodo = document.getElementById("audi");
    nodo.style.display = "none";
    var nodo = document.getElementById("saab");
    nodo.style.display = "none";
    var nodo = document.getElementById("opel");
    nodo.style.display = "none";
    prezzo = 20000;
    }
    else if (scelta == "audi"){
        var nodo = document.getElementById("audi");
    nodo.style.display = "block";
    var nodo = document.getElementById("volvo");
    nodo.style.display = "none";
    var nodo = document.getElementById("saab");
    nodo.style.display = "none";
    var nodo = document.getElementById("opel");
    nodo.style.display = "none";
    prezzo = 18000;
 
    }
    else if (scelta == "opel"){
        var nodo = document.getElementById("opel");
    nodo.style.display = "block";
    var nodo = document.getElementById("volvo");
    nodo.style.display = "none";
    var nodo = document.getElementById("audi");
    nodo.style.display = "none";
    var nodo = document.getElementById("saab");
    nodo.style.display = "none";
    prezzo = 13000;
    }
    else if (scelta == "saab"){
        var nodo = document.getElementById("saab");
    nodo.style.display = "block";
    var nodo = document.getElementById("volvo");
    nodo.style.display = "none";
    var nodo = document.getElementById("audi");
    nodo.style.display = "none";
    var nodo = document.getElementById("opel");
    nodo.style.display = "none";
    prezzo = 15000;
    }
    nodoPrezzo.textContent = "Costo" + prezzo + "€"
   }
 
 
</script>
 
 
 
</head>
<body>
    <input type="button" onclick="change()" value="cliccami">
    <input type="button" onclick="change1()" value="cliccami">
    <div id = "change">
        Benvenuti al corso di programmazione web
    </div>
    <img src="img/volvo.jpeg" id = "volvo">
    <img src="img/audi1.jpeg" id = "audi">
    <img src="img/saab.jpeg" id = "saab">
    <img src="img/opel.jpeg" id = "opel">
    <hr>
 
        <label for="cars">Choose a car:</label>
        <select name="cars" id="cars">
          <option value="volvo">Volvo</option>
          <option value="saab">Saab</option>
          <option value="opel">Opel</option>
          <option value="audi">Audi</option>
        </select>
        <br><br>
 
 
      <button  onclick="scelta()"> Scegli </button>
      <hr>
      <hr>
      <div id = "result">
      </div>
      <div id="prezzo"></div>
</body>
 
</html>
Editor is loading...