JavaScript getElementById Substrinhe problema

Question

Tenho uma pergunta simples sobre o JavaScript. Estou tentando imprimir em um loop alguns valores para dividir o contêiner. O problema é que, em vez disso, imprimir o valor várias vezes em um loop, cada vez que é substituído e, como resultado, recebo apenas um valor. Veja o código abaixo:

for (i=0; i<json.Locations.length; i++) {
    var location = json.Locations[i];
    var content = document.getElementById('eventsnearby');                                                    
    var html = location.name;
    content.innerHTML = html;
}

Quaisquer idéias são bem -vindas. Obrigado.

Answer 1

Anexar, não atribua.

content.innerHTML += html;

Melhor ainda, use o DOM padrão.

var content = document.getElementById('eventsnearby');                                                        
for (var i = 0; i < json.Locations.length; i++) {
    var text = json.Locations[i].name;
    var node = document.createTextNode(text);
    content.appendChild(node);
}

Answer 2

Você obtém apenas um valor porque está configurando a propriedade InnerHTML durante cada iteração do loop em vez de anexá -la. Tente usar content.innerHTML += html;.

Answer 3

for (i=0; i<json.Locations.length; i++) {
var location = json.Locations[i];

var content = document.getElementById('eventsnearby');                                                    
var html = location.name;
content.innerHTML += html;
}