Fermer

Exemple fetch en javascript méthode GET

Exemple de script javascript pour récupérer un fichier json avec une méthode GET.

Le fichier json ayant servi dans l’exemple provient de https://calendrier.api.gouv.fr/jours-feries/.

Télécharger le fichier des jours fériés 2022 : 2022.json.

Le bout de code javascript se charge de récupérer le fichier json ; de parser son contenu et d’afficher une liste à puce des jours fériés.

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Fetch</title>
</head>
<body>
<script>
fetch('2022.json', {
    method: 'GET',
}).then((response) => {
    console.log('fetch OK');
    return response.json();
}).then((data) => {
//    console.log('**', typeof data, data);
    let ul = document.createElement("ul");
    for (const element in data) {
        var li = document.createElement("li");
        li.innerHTML = element + ' : ' + data[element];
        ul.appendChild(li);
    }
    document.body.appendChild(ul);

}).catch((error) => {
    console.log('Erreur : ' + error.message);
});
</script>
</body>
</html>

Laisser une réponse

Your email address will not be published. Required fields are marked *