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>
    <script>
window.onload = gestoreLoad;
 
function gestoreLoad(){
 
    var btn = document.getElementById("btn");
    btn.onclick = creaMacchina;
 
 
 
class Car {
 
 constructor (name, year){
 
    this.name = name;
    this.year = year;
 
 
 } 
 // creo un metodo che deve ritornare la stampa con le proprietà dell'oggetto
 visualizza(){
 
     return "Nome: " + this.name + " anno di immatricolazione: " + this.year;
 
 }
 
 anni(){
     const d = new Date();
  let anno = d.getFullYear();
     return "La macchina ha: " + (anno-this.year) +
     " anni di vita";
 }

}




function remove(){
 
    var nodo = document.getElementById("result");
 
    while (nodo.firstChild) {
 
        nodo.removeChild(nodo.firstChild);
    }}
 
 //istanza car creata tramite input dell'utente


 function creaMacchina(){
 
    var nome = document.getElementById("name").value;
    var year = document.getElementById("year").value;
    var anni = parseInt(year);
 
    var c1 = new Car(nome, anni);
 
    var nodo = document.getElementById("result");
    remove();
    var nuovoNodo = document.createElement("p");
    var nuovoNodo1 = document.createElement("p");
    nuovoNodo.textContent = c1.visualizza(); // Imposta il testo del nuovo elemento
                nodo.appendChild(nuovoNodo);
                nuovoNodo1.textContent = c1.anni(); // Imposta il testo del nuovo elemento
                nodo.appendChild(nuovoNodo1);
 
 
 }
 
}
 
    </script>
</head>
<body>
<h3> La mia macchina   </h3>
Inserisci il nome della macchina <input type = "text" id = "name"> <br> <br>
Inserisci l'anno di immatricolazione <input type = "text" id = "year"> <br>
 <br>
<button id = "btn">Invia</button>
<hr>
<div id = "result"></div>
</body>

    </html>
Editor is loading...