jQuery: análisis de datos JSON: problemas con el nombre de la variable

Question

Mi primera profundización en trabajar con datos JSON. Aunque tengo un poco de experiencia usando jQuery.

Estoy publicando en esta URL (api de tumblr): jyoseph.com/api/read/json

Lo que intento hacer es generar el json que se devuelve. Lo que tengo hasta ahora:

$(document).ready(function(){ 

$.getJSON("http://jyoseph.com/api/read/json?callback=?", 
  function(data) { 
    //console.log(data); 
    console.log(data.posts);         

      $.each(data.posts, function(i,posts){ 
        var id = this.id; 
        var type = this.type; 
        var date = this.date; 
        var url = this.url; 
        var photo500 = this.photo-url-500; 

        $('ul').append('<li> ' +id+ ' - ' +type+ ' - ' +date+ ' - ' +url+ ' - ' +photo500+ ' - ' + ' </li>'); 
      }); 

  }); 

});

Vea mi publicación jsbin para ver el script completo: http://jsbin.com/utaju/edit

Algunas de las teclas de tumblr tienen " - " guiones en ellos, y eso parece estar causando un problema. Como puede ver, photo-url-500 " u otro '' pie de foto '' está causando que el script se rompa, está generando NaN.

¿Hay algún problema con tener guiones en los nombres clave? ¿O estoy haciendo todo esto mal?

Answer 1

Si hay guiones en los nombres, necesitará acceder a ellos de manera diferente. Cambie var photo500 = this.photo-url-500; para leer var photo500 = this [" photo-url-500 "]; .

Answer 2

Tenga en cuenta que es mejor no agregar dentro de cada iteración. Es mejor agregar a una cadena o insertar en una matriz y luego agregar una vez después de que el iterador haya terminado. Apelar al dom es costoso.

Answer 3

Utilice la notación de corchetes para acceder a los miembros:

var photo500 = this['photo-url-500'];