Aufgabe

Sie erstellen eine Webseite, die eine Liste von Hunderassen und deren Informationen anzeigt, die von der Dog API abgerufen werden. Wenn der Benutzer auf die Schaltfläche "Rassen laden" klickt, sollten die Daten von der API abgerufen und die Informationen zur Rasse (Name, Beschreibung und Lebensdauer) auf der Webseite angezeigt werden. Behandeln Sie alle potenziellen Fehler und geben Sie Feedback im HTML.

Daten von der API abrufen: Wenn die Schaltfläche "Rassen laden" geklickt wird

1. Daten von https://dogapi.dog/api/v2/breeds abrufen;

2. Die JSON-Antwort parsen;

3. Wenn die Daten erfolgreich abgerufen wurden, fahren Sie mit dem nächsten Schritt fort;

4. Wenn beim Abrufen der Daten ein Fehler auftritt, zeigen Sie "Failed to load breeds. Please try again later." im error-message Element an.

• Verwenden Sie fetch('https://dogapi.dog/api/v2/breeds') , um Daten von https://dogapi.dog/api/v2/breeds abzurufen;

• Verwenden Sie response.json() , um die JSON-Antwort zu parsen;

• Rufen Sie nach dem Parsen der Daten im folgenden then -Block die Funktion displayBreeds auf und übergeben Sie data.data als Argument;

• Behandeln Sie im catch -Block alle potenziellen Fehler.