Leer y recorrer JSON con Ajax y JQuery

http://es.wikicode.org/index.php/Leer_y_recorrer_JSON_con_Ajax_y_JQuery

Objetivo

Recuperar la estructura de datos de un archivo JSON y tratarla como una array de datos normal, tanto indexada como asociativa.
Archivos

data.json
index.html
js.js

data.jason

{
“data1”:
{
“value”:”abcde”
},
“data2”:
[
{
“value1″:”A”,
“value2″:”A”
},
{
“value1″:”B”,
“value2″:”B”
},
{
“value1″:”C”,
“value2″:”C”
},
]
}

Los elementos que van entre {} son accesibles mediante asociación de literales, mientras que los que están entre [] lo son mediante indexación.
index.html

js.js

var data;

$(document).ready(function() {
$.ajax({
url: “data.json”,
data: “nocache=” + Math.random(),
type: “GET”,
dataType: “json”,
success: function(source){
data = source;
showInfo();
},
error: function(dato){
alert(“ERROR”);
}
});
});

function showInfo(){
$(“#data”).append(data[‘data1’][‘value’]);

$.each(data[‘data2’], function(index, value) {
$(“#data”).append(‘

index: ‘ + index + ‘ value1: ‘ + data[‘data2’][index][‘value1’] + ‘ value2: ‘ + data[‘data2’][index][‘value2’] + ‘

‘);
});
}

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: