无法从《纽约时报》 API检索数据

Question

我正在尝试从《纽约时报》 API中获取最多的image，title，short description和url故事。在获得所需的所有信息之前，我试图仅获取标题，但似乎无法显示任何信息。我的代码有问题吗？

更新：我已经将元素添加到DOM中（请参见下面的代码），但是标题仍然没有显示。我还尝试过在控制台上打印它，但那里也没有打印。

var url = 'https://api.nytimes.com/svc/topstories/v2/science.json?api-key=MY_API_KEY'
function setup() {
    noCanvas()
    loadJSON(url, gotData)
}

function gotData(data) {
const articles = data.results

for (let i = 0; i < articles.length; i++) {
    const title = document.createElement('h1') 
    title.innerText = articles[i].title 
    document.body.appendChild(title)
}
}

Answer 1

好吧，您创建了元素，但是仍然需要将其添加到DOM。

---

创建元素：

const title = document.createElement('h1')

并将其添加到DOM（以使其实际显示在您的页面上）：

document.body.appendChild(title)

---

但是现在您仍然需要从API中添加您的实际标题：

title.innerText = articles[i].title

一起：

const title = document.createElement('h1') // create the heading
title.innerText = articles[i].title // add the title from the API to your heading
document.body.appendChild(title) // add your heading to the DOM (this will make it appear)

Answer 2

看看这个。我回答了你的欺骗，但这是更好的

let html = [];
fetch('https://api.nytimes.com/svc/topstories/v2/science.json?api-key=yourApiKey')
  .then((resp) => resp.json())
  .then(function(data) {
    data.results.forEach(res => {
      html.push(`<h1>${res.title}</h1>`);
    })
    document.getElementById("res").innerHTML = html.join("");
  })

<div id="res"></div>