Cómo insertar un objeto JSON en una lista desordenada

Question

Tengo un objeto JSON que creé usando obj= json.Parse (datos)."Datos" se recibieron de un servidor web.Sé que el objeto es correcto porque puedo imprimir variables individuales desde un div o mi lista.

Esto es lo que se crea el objeto JSON:

["Nombre": "StauriKosaurus", "Grupo": "Saurischia", "Dieta": "Carnívoro", "Período": "Triásico"}, {"Nombre": "Diplodocus", "GRUPO": "Saurischia", "Dieta": "Herbivore", "Período": "Jurásico"}, {"Nombre": "STEGOSAURUS", "GRUPO": "ornithischia", "dieta": "herbívoro", "período": "Jurásico"}, {"Nombre": "Tyrannosaurus", "Grupo": "Saurischia", "Dieta": "Carnívoro", "Período": "CRETÍCULO"}]

literalmente todo lo que quiero hacer es poner esto en un para aparecer en una página web.

Mi código actual:

 function getJson(){$.get(MY URL, function(data) {
            // String
            //console.dir(data);

            // Parse JSON
            var obj = JSON.parse(data);

            // JSON object
            //console.dir(obj);
            $('#myList').html("<li>"+obj[0].period+"</li><li>"+obj[2].period+"</li>");
            //$('#myList').html("<li>obj[2].period</li>");
        });

    }

Esto imprime con éxito la lista con Triásico y luego Jurrasic.

Preferiría hacer esto en jQuery, pero JavaScript está bien.

gracias.

Answer 1

No está iterando a través de la lista, simplemente imprimiendo el 0-Th y el segundo elemento en la matriz.Prueba:

function getJson(){$.get(MY URL, function(data) {
        // String
        //console.dir(data);

        // Parse JSON
        var obj = JSON.parse(data);

        // JSON object
        //console.dir(obj);
        var inner = '';
        for(i=0; i < obj.length; i++) {
             inner += "<li>"+obj[i].period+"</li>";
        }
        $('#myList').html(inner);
    });

}

Estoy seguro de que hay una manera más limpia con jQuery, pero eso debería funcionar

Answer 2

Si desea utilizar la sintaxis jQuery, procese así:

var listElement = '';

$.each(obj, function(index, value) {
    listElement += '<li>' + data[obj].period + '</li>';
})

$('#myList').html(listElement);