Herausforderung: Abrufen und Verwenden von API-Daten
Aufgabe
Eine Webseite soll eine Liste von Hunderassen und deren Informationen anzeigen, die von der Dog API abgerufen werden. Wenn der Benutzer auf die Schaltfläche "Rassen laden" klickt, sollen die Daten von der API abgerufen und die Informationen zu den Rassen (Name, Beschreibung und Lebensspanne) auf der Webseite angezeigt werden. Mögliche Fehler sind zu behandeln und Rückmeldungen im HTML bereitzustellen.
Daten von der API abrufen: Wenn die Schaltfläche "Rassen laden" geklickt wird
- Daten von
https://dogapi.dog/api/v2/breeds
abrufen; - Die JSON-Antwort parsen;
- Wenn die Daten erfolgreich abgerufen wurden, mit dem nächsten Schritt fortfahren;
- Falls beim Abrufen der Daten ein Fehler auftritt, im Element
"Failed to load breeds. Please try again later."
die Meldungerror-message
anzeigen.
index.html
index.css
index.js
- Verwenden von
fetch('https://dogapi.dog/api/v2/breeds')
zum Abrufen der Daten vonhttps://dogapi.dog/api/v2/breeds
; - Verwenden von
response.json()
zum Parsen der JSON-Antwort; - Nach dem Parsen der Daten im folgenden
then
-Block die FunktiondisplayBreeds
aufrufen unddata.data
als Argument übergeben; - Im
catch
-Block mögliche Fehler behandeln.
index.html
index.css
index.js
Danke für Ihr Feedback!
Fragen Sie AI
Fragen Sie AI
Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen
Can you show me the HTML structure for displaying the breeds and error messages?
What should the `displayBreeds` function do with the breed data?
Do you need help writing the JavaScript to fetch and display the breeds?
Awesome!
Completion rate improved to 2.22
Herausforderung: Abrufen und Verwenden von API-Daten
Swipe um das Menü anzuzeigen
Aufgabe
Eine Webseite soll eine Liste von Hunderassen und deren Informationen anzeigen, die von der Dog API abgerufen werden. Wenn der Benutzer auf die Schaltfläche "Rassen laden" klickt, sollen die Daten von der API abgerufen und die Informationen zu den Rassen (Name, Beschreibung und Lebensspanne) auf der Webseite angezeigt werden. Mögliche Fehler sind zu behandeln und Rückmeldungen im HTML bereitzustellen.
Daten von der API abrufen: Wenn die Schaltfläche "Rassen laden" geklickt wird
- Daten von
https://dogapi.dog/api/v2/breeds
abrufen; - Die JSON-Antwort parsen;
- Wenn die Daten erfolgreich abgerufen wurden, mit dem nächsten Schritt fortfahren;
- Falls beim Abrufen der Daten ein Fehler auftritt, im Element
"Failed to load breeds. Please try again later."
die Meldungerror-message
anzeigen.
index.html
index.css
index.js
- Verwenden von
fetch('https://dogapi.dog/api/v2/breeds')
zum Abrufen der Daten vonhttps://dogapi.dog/api/v2/breeds
; - Verwenden von
response.json()
zum Parsen der JSON-Antwort; - Nach dem Parsen der Daten im folgenden
then
-Block die FunktiondisplayBreeds
aufrufen unddata.data
als Argument übergeben; - Im
catch
-Block mögliche Fehler behandeln.
index.html
index.css
index.js
Danke für Ihr Feedback!