Javascript 将响应结果循环到HTML列表中

我的目标是获取placeResult中的所有内容并将其加载到列表中。您的列表如下所示

照片、格式化地址、评级

照片、格式化地址、评级

照片、格式化地址、评级

其中每个

上都有来自阵列的新照片、来自阵列响应的新地址和评级。此处的placeResult响应示例：

{formatted_address: "1111 Example Rd, CityName, State 33333, USA", name: "Ruby Tuesday", photos: Array(10), rating: 4.1},
{formatted_address: "2222 Example Rd, CityName, State 44444, USA", name: "McDonalds", photos: Array(10), rating: 3.1},
{formatted_address: "3333 Example Rd, CityName, State 55555, USA", name: "Burger King", photos: Array(10), rating: 2.1}

我最好的猜测是我需要一个二次循环来处理这个问题。目前，它只是从同一个位置重复同一张照片，并填充

代码

if (placeResult.photos) {
    const ulList = document.createElement('ul');
    infoPane.append(ulList);
    const liList = document.createElement('li');
    ulList.append(liList);
    for (var i = 0; i < placeResult.name.length; i++) {
      console.log("PlaceResult", placeResult.formatted_address);
      const firstPhoto = placeResult.photos[0];
      const photo = document.createElement('img'); 
      photo.classList.add('hero');
      photo.src = firstPhoto.getUrl()
      liList.appendChild(photo);
    }
   }

if（placeResult.photos）{
const ulList=document.createElement（'ul'）；
infoPane.append（ulList）；
const liList=document.createElement（'li'）；
ulList.append（liList）；
for（var i=0；i

您可能应该重写第8行：

const firstPhoto = placeResult[i].photos[0];

或者您在循环退出条件中犯了错误，可能您的意思是：

for (var i = 0; i < placeResult.length; i++) { .. } //iterate over places array
//or..
for (var i = 0; i < placeResult.photos.length; i++) { .. } // iterate over photos array

for（var i=0；i