Javascript getElementById覆蓋問題

Question

我有一個關於Javascript的簡單問題。 我正在嘗試將一些值循環打印到div容器中。 問題是，每次循環重寫該值幾次，每次覆蓋它一次，結果我只能得到一個值。 請參見下面的代碼：

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;
}

任何想法都歡迎。 謝謝。

Answer 1

追加，不分配。

content.innerHTML += html;

更好的是，使用標准DOM。

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

您只能得到一個值，因為您是在每次循環迭代期間設置innerHTML屬性，而不是附加到該屬性。 嘗試使用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;
}