Site icon Régis Enguehard

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>

Quitter la version mobile