Tengo un bucle foreach que pasa por todos los resultados posibles de una consulta API

json.results.forEach(function(result) {
     console.log(result.original_title);
     document.getElementById("possibleResults").innerText = result.original_title;
}, this);

console.log muestra todos los elementos correctamente, sin embargo, como era de esperar, cuando escribo en el div posibles resultados , solo muestra el último resultado.

¿Cómo puedo escribir mis resultados en un div secuencialmente, para que no se sobrescriban, preferiblemente sin CSS?

1
user3335607 11 ene. 2017 a las 06:04

3 respuestas

La mejor respuesta

Cambie document.getElementById("possibleResults").innerText = result.original_title; a document.getElementById("possibleResults").innerText += result.original_title; La primera opción reemplaza el contenido actual del div, es por eso que solo ve el último resultado. El segundo lo agrega hasta el final, manteniendo cada resultado.

3
Emilio Venegas 11 ene. 2017 a las 03:06

Esto es porque

document.getElementById("possibleResults").innerText = result.original_title;

Cada iteración siguiente sobrescribirá el texto insertado por el anterior.

Pruebe con

json.results.forEach(function(result) {
     console.log(result.original_title);
     document.getElementById("possibleResults").innerText += result.original_title

}, this);
0
Deep 11 ene. 2017 a las 03:07

Agregue todo el contenido después de que esté escrito en una variable.

var content;
json.results.forEach(function(result) {
       console.log(result.original_title);
       content += result.original_title;
}, this);

        document.getElementById("possibleResults").innerText = content;
0
Yaje 11 ene. 2017 a las 03:18