let leadTracker = []; const inputText = document.getElementById("input-text"); const inputButton = document.getElementById("input-button"); const Listing = document.getElementById("listings"); inputButton.addEventListener("click", function () { leadTracker.push(inputText.value); clicker(); }); function clicker() { for (let i = 0; i < leadTracker.length; i++) { Listing.innerText += leadTracker[i]; console.log(leadTracker); } }Agregué bro a la matriz y luego volví, pero bro se repite. Este es exactamente el mismo código que leí en línea, pero todavía no funciona bien para mí.
Tienes varias maneras de hacer esto: primero tienes que no usar for loop en la función
function clicker() { Listing.innerText += leadTracker[leadTracker.length-1]; console.log(leadTracker); }o puede eliminar todo el texto interno del elemento y luego volver a escribirlo:
function clicker() { Listing.innerText = ""; for (let i = 0; i < leadTracker.length; i++) { Listing.innerText += leadTracker[i]; console.log(leadTracker); } }Cada vez que hace clic en el botón, toma el contenido del campo de texto y lo agrega a la matriz de leadTracker . Entonces, la matriz crece con cada clic, más y más. Hasta aquí todo bien.
Pero en la función de clicker , que también se ejecuta en cada clic, toma todo el contenido de la matriz y lo agrega a Listing . La matriz no se borra entre clics, por lo que los elementos antiguos se imprimirán nuevamente.
Puede omitir el uso de una matriz en absoluto:
inputButton.addEventListener("click", function () { Listing.innerText += inputText.value; }); o reemplace el texto interno de Listing en lugar de agregarlo, como se sugiere en otras respuestas.
Cada vez que llame al clicker, agregará toda la matriz a la lista, incluidas las cosas que ya están allí.
¿Quería borrar la lista al comienzo del clicker, antes del bucle for?
Listing.innerText = ""