0

tengo el siguiente código para mostrar en el html lo que contiene un archivo json. El problema es que no se imprime, y en la consola no se muestra ningún error (lo estoy haciendo con Live Server). El unico error que se muestra es en Mozilla, dice lo siguiente (no entiendo que significa): GET http://127.0.0.1:5500/pingus.json [HTTP/1.1 304 Not Modified 1ms]

JS:

    window.addEventListener("load", inicio);
function inicio(){
  document.getElementById("cargaInformacion").addEventListener('click', cargar);
}

function crearPromesa(url) {
    return new Promise (function (resolve,reject) {
      var xhr = new XMLHttpRequest();
      xhr.open("GET",url,true);
      xhr.onreadystatechange = function(){
        if (this.status == 200 && this.readyState == 4) {
         resolve(this)
        }
      };
      xhr.onerror = function() {
        reject (Error("Network Error"));
      }; 
      xhr.send();
    });
  }

  function cargar(){
    let url = "personas.json";
    crearPromesa(url)
    .then (json => cargarJSON(json))
    .catch(e => console.log(e));
  }
  

    function cargarJSON(json)
    {
       var myObj = JSON.parse(json.responseText);
           nombres = Object.keys(myObj); // genera un array con el nombre de las propiedades del objeto
           for(i=0;i<myObj.lenght; i++){

             document.getElementById("contenedor").innerHTML += myObj[i].nombre + "</p><br> <img src="+ myObj[i].ruta+"></img>"
           }
        
  } 

HTML

     <div >
    <img id="img1" src="./images/pingu4.jpg" />
    <p> imagen 1 </p>
  </div>
  <div id="contenedor"></div>

JSON

[
    {
    "nombre": "persona1",
    "ruta": "./images/image1.jpg"
}, {
    "nombre": "persona2",
    "ruta": "./images/image2.jpg"
}, {
    "nombre": "persona3",
    "ruta": "./images/image3.jpg"
}
]
2
  • Intenta en otro navegador a ver si tienes el mismo error, si no tienes errores en otro navegador prueba borrando el cache de firefox
    – Franco
    el 23 feb. 2021 a las 20:02
  • Yo no veo el elemento html que tiene el id contenedor. Se supone que ahí es donde quieres devolver los datos.
    – g.4
    el 23 feb. 2021 a las 20:04

1 respuesta 1

0

Encontré el error, en el for hay un fallo de ortografía, en lugar de "myObj.lenght" deberia ser "myObj.length". Lo que me parece curioso es que la consola propia del navegador no informaba de este error.

1
  • Si ese es el motivo del fallo entonces me temo que la pregunta quedaría cerrada pues es un typo en la sintaxis
    – BetaM
    el 24 feb. 2021 a las 19:51

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.