как продолжить работу с этим API

Question

Чтобы улучшить свои навыки веб-разработки, sh я пытаюсь заново изучить API. Я получил с этого веб-сайта: https://documenter.getpostman.com/view/10808728/SzS8rjbc?version=latest

В моем JS файле у меня есть следующий код:

var requestOptions = {
  method: 'GET',
  redirect: 'follow'
};

fetch("https://api.covid19api.com/summary", requestOptions)

  .then(response => response.text())

  .then(result => console.log(result))

  .catch(error => console.log('error', error));

И я вижу, что он регистрирует много данных, но я не уверен, как получить определенные c данные из API и отобразить их на странице HTML.

Я пробовал что-то подобное в файле JS :

var requestOptions = {
  method: 'GET',
  redirect: 'follow'
};

fetch("https://api.covid19api.com/summary", requestOptions)

  .then(response => response.text())

  .then(result => console.log(result))

  .catch(error => console.log('error', error));

let tdeaths = data.global.TotalDeaths;

document.getElementById('tdeaths').innerHTML = tdeaths.toLocaleString('en');

Но в моем HTML файле ничего не отображается с

Answer 1

Вижу две проблемы.
1. Как вы обновляете data.global.TotalDeaths? он примет начальное значение, потому что tdeaths не получает вывода из ответа.
2. Оператор document.getElementByid будет запущен до того, как он получит значения из API. поэтому после исправления 1-й проблемы вы должны поместить инструкцию, как показано ниже (с учетом результата = данные)

.then(result => {
     let tdeaths = result.global.TotalDeaths;
     document.getElementById('tdeaths').innerHTML = tdeaths.toLocaleString('en');
  })

Answer 2

вы должны поместить свой код в оператор .then. Это должно выглядеть так:

fetch("https://api.covid19api.com/summary", requestOptions)

  .then(response => response.json())

  .then(result => {
   let tdeaths = result.global.TotalDeaths;
   document.getElementById('tdeaths').innerHTML = tdeaths.toLocaleString('en');
   })

  .catch(error => console.log('error', error));