La búsqueda de Json ha funcionado antes en el sitio, por ejemplo aquí, donde usé los mismos procesos: https://n-ce.github.io/Sea-arch
aquí está el guión
//FETCH function content(a){ fetch(a+'.json').then(function (response) { return response.json(); }).then(function (data) { appendData(data); }).catch(function (err) { console.log('error: ' + err); }); } //Loading the objects var root = document.getElementById('root'); function appendData(data) { for (var i = 0; i < data.length; i++) { var p = document.createElement("p"); p.innerHTML = data[i].Name; root.appendChild(p); } } // Remove Function function remove(){ while (root.hasChildNodes()) { root.removeChild(root.firstChild); } } // Click decision making var count = couns = 0; function Sites() { if(count%2==0){ content('Sites'); count++; } else{ count--; remove(); } } function Animals() { if (couns % 2 == 0) { content('Animals'); couns++; } else { couns--; remove(); } }
Y este es el HTML
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>JSON SD</title> <link rel="stylesheet" href="style.css"/> </head> <body onload="content('Onload')"> <span> <button onclick="Animals()">Load Animals</button> <button onclick="Sites()">Load Sites</button> </span> <div id="root"></div> <script src="script.js"></script> </body> </html>
No tengo forma de depurar esto dado que la consola no arroja ningún error ya que funciona bien en localhost. Soy bastante nuevo en la API Fetch, pero estoy pensando que tal vez se deba a que los archivos json que se están transfiriendo están tardando demasiado. ¿Alguien puede resaltar cuál es el problema?
Así es como funcionó para las páginas de github, gracias a @programmarRaj por resaltar Script
//FETCH function content(a){ fetch("./"+a+".json").then(function (response) { return response.json(); }).then(function (data) { appendData(data); }).catch(function (err) { console.log('error: ' + err); }); }