Как я должен пройти через эти данные JSON?

Question

Как я должен пройти через эти данные JSON?

1

Вот мой код. Я хочу распечатать свойство "song" из данных. Ссылка на JSON → http://starlord.hackerearth.com/sureify/cokestudio

<script type="text/javascript">
    var requestURL = 'http://starlord.hackerearth.com/sureify/cokestudio';

    var request = new XMLHttpRequest();

    request.open('GET', requestURL);

    request.responseType = 'json';

    request.send();

    request.onload = function(){
        var myjsondata = request.response;
        showdata(myjsondata);
    } 

    function showdata(data){
        var song_name = data;

        for (i = 0; i < 3; i++) {

            document.write(song_name);
            document.write("<br>");

        }
    }

</script>

Когда я запускаю его в браузере, я получаю [Object Object], [Object Object], [Object Object], [Object Object], [Object Object] как OUTPUT или undefined.

rock stone 03 июнь 2017, в 19:40

Источник

Теги:

javascript

json

5 ответов

1

Вы не можете записать весь объект песни в документ. Вы должны сначала отобразить его:

var songNames = data.map(function(item) { return item.song; });

Это даст вам массив всех имен (строк), которые вы можете записать в документ:

songNames.forEach(function(songName) {
    document.write(songName + '<br>');
});

Duncan Luk 03 июнь 2017, в 14:50

0

Ответ от запроса представляет собой массив объектов json, и вы просто пытаетесь снова и снова писать возвращаемый объект. Вам нужно перебрать возвращаемые данные и вывести каждое значение объекта. Измените функцию showdata следующим образом:

function showdata(data){


        for (i = 0; i < 3; i++) {

            document.write(data[i].song);
            document.write("<br>");

        }
    }

Siddharth 03 июнь 2017, в 15:31

0

Вам нужно использовать JSON.stringify; и если вы планируете писать в документ, я предлагаю обертывание в pre тегах, а также сохранить строковый формат.

let data = [  
  {  
    "song":"Afreen Afreen",
    "url":"http://hck.re/Rh8KTk",
    "artists":"Rahat Fateh Ali Khan, Momina Mustehsan",
    "cover_image":"http://hck.re/kWWxUI"
  },
  {  
    "song":"Aik Alif",
    "url":"http://hck.re/ZeSJFd",
    "artists":"Saieen Zahoor, Noori",
    "cover_image":"http://hck.re/3Cm0IX"
  },
  {  
    "song":"Tajdar e haram",
    "url":"http://hck.re/wxlUcX",
    "artists":"Atif Aslam",
    "cover_image":"http://hck.re/5dh4D5"
  }
];

document.write('<pre>'+ JSON.stringify(data, null, '\t') + '</pre>');

EyuelDK 03 июнь 2017, в 15:04

0

Вы должны укрепить объект, чтобы сделать его читаемым.

<html>
<body>
<script type="text/javascript">
    var requestURL = 'http://starlord.hackerearth.com/sureify/cokestudio';

    var request = new XMLHttpRequest();

    request.open('GET', requestURL);

    request.responseType = 'json';

    request.send();

    request.onload = function(){
        var myjsondata = request.response;
        showdata(myjsondata);
    } 

    function showdata(data){
        var song_name = data;

        for (i = 0; i < 3; i++) {

            document.write(JSON.stringify(song_name));
            document.write("<br>");

        }
    }

</script>
</body>
</html>

n33rma 03 июнь 2017, в 13:56

Ещё вопросы

Jonas Wilms · Accepted Answer · 2017-06-03T14-33-00.000Z

Ваши данные выглядят так:

[  //the array in data
{  //the first object, e. g. data[0]
  "song":"Afreen Afreen", // song => data[0].song
  "url":"http://hck.re/Rh8KTk",
  "artists":"Rahat Fateh Ali Khan, Momina Mustehsan",
  "cover_image":"http://hck.re/kWWxUI"
},
{  
  "song":"Aik Alif",
  "url":"http://hck.re/ZeSJFd",
  "artists":"Saieen Zahoor, Noori",
  "cover_image":"http://hck.re/3Cm0IX"
},
{  
  "song":"Tajdar e haram",
  "url":"http://hck.re/wxlUcX",
  "artists":"Atif Aslam",
  "cover_image":"http://hck.re/5dh4D5"
}]

Таким образом, чтобы выполнить цикл, вы можете сделать

var limit=Math.max(data.length,100);//max displayed number

for(var i=0;i<limit;i++){
 document.write(data[i].song+"<br>");
}

Весь код:

    document.write("loading...");

    xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
      if (xhr.readyState == XMLHttpRequest.DONE) {        
        var data= JSON.parse(xhr.responseText);
        var limit=Math.max(data.length,100);
        for(var i=0;i<limit;i++){
         document.write(data[i].song+"<br>");
        }
      }
    };
    
    xhr.open('GET', 'http://starlord.hackerearth.com/sureify/cokestudio', true);
    xhr.send(null);

но когда я запускаю его в mozilla, веб-страница продолжает загружаться, как это остановить, если я использую оператор break? но где? @Jonas w
@ камень камень, так что вы хотите ограничить результаты?
Я хочу отобразить все 9 песен в файле JSON, поэтому после того, как все песни напечатаны на экране, они должны прекратить загрузку, но это не останавливает @Jonas w
@ камень камень верхний код делает
Хорошо, спасибо @Jonas w отлично работает.