Cuando intento escribir en cuadros de texto por segunda vez, la ventana se muestra indefinida, y si intento escribir en cuadros de texto por tercera vez, no muestra nada.
Tengo una tabla a la que deseo agregarle un tablero. Entonces, cuando se hace clic en un botón, se agregará un tr a un cuerpo, funciona en el primer clic, pero no en el segundo o tercero.
var expName = document.getElementById("expName"); var button = document.getElementById("button"); var amount = document.getElementById("amount"); var tbody = document.getElementById("tbody"); var date = document.getElementById("calendar"); var clear = document.getElementById("clear"); //print the tabledata button.addEventListener("click", function() { expName = expName.value; amount = amount.value; date = date.value; var tr = document.createElement("tr"); tr.innerHTML += "<td>" + expName + "</td>" + "<td>" + amount + "</td>" + "<td>" + date + "</td>"; //set the value back to the original tbody.appendChild(tr); document.getElementById("expName").value = ""; document.getElementById("amount").value = ""; document.getElementById("calendar").value = ""; //delte all table rows clear.addEventListener("click", function() { window.location.reload(); }) <h1>Expense Tracker</h1> <b>Item Name: </b><input type="text" id="expName"> <br/> <br/> <b>Amount: </b><input type="text" id="amount"> <b>Date: </b><input type="date" id="calendar"> <br/> <br/> <button id="button">add expense</button> <button id="clear">Clear List</button> <br/> <br/> <table id="table"> <thead> <th>Name</th> <th>Amount</th> <th>Date</th> </thead> <tbody id="tbody"></tbody> </table>