javascript - 在循环中使用innerHTML无法正确显示json结果集

Question

我使用 HTML onclick 事件调用一个函数，该函数将读取包含 JSON 语法的 Javascript 字符串并输出结果，但仅显示最后一个结果。

var resorts = '{ "skiResorts" : [' +
    '{ "resortName":"Afton Alps" , "resortState":"Minnesota" },' +
    '{ "resortName":"Alpine Way" , "resortState":"Pennsylvania" },' +
    '{ "resortName":"Alyeska" , "resortState":"Alaska" } ]}';
var obj = JSON.parse(resorts);

function displaySkiResorts() {
    //code
    for (i = 0; i < obj.length; i++) {
        document.getElementById("req8").innerHTML = obj.skiResorts[i].resortName + " " + obj.skiResorts[i].resortState;
    }
}

为什么这不显示整个滑雪场？

Answer 1

我更改了对数组长度的正确访问obj.skiResorts.length ，将分配更改为 +=并添加换行符 <br> .

var resorts = '{ "skiResorts" : [' +
         '{ "resortName":"Afton Alps" , "resortState":"Minnesota" },' +
         '{ "resortName":"Alpine Way" , "resortState":"Pennsylvania" },' +
         '{ "resortName":"Alyeska" , "resortState":"Alaska" } ]}';

var obj = JSON.parse(resorts);
function displaySkiResorts() {
    for (i = 0; i < obj.skiResorts.length; i++) { // obj.skiResorts.length right array
        document.getElementById("req8").innerHTML += obj.skiResorts[i].resortName + " " + obj.skiResorts[i].resortState + '<br>'; // += and <br> 
    }
}
displaySkiResorts();

<div id="req8"></div>