我應該如何循環瀏覽這個JSON數據？

這裏是我的代碼，我想從數據打印出「歌」屬性。鏈接JSON是 - >http://starlord.hackerearth.com/sureify/cokestudio 我應該如何循環瀏覽這個JSON數據？

<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>

當我運行在瀏覽器中，我得到[對象對象]，[目標對象]，[目標對象]，[目標對象]，[目標對象]爲輸出或未定義。

來源

2017-06-03 rock stone

你不能直接在瀏覽器上打印對象，你需要解析它。 –

無需使用解析@NitinDhomse我得到了答案感謝您的回覆，您可以檢查喬納斯答案。 –

你的數據是這樣的：

[ //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);

來源

2017-06-03 16:47:50

謝謝@Jonas你讓我的一天。 –

但是當我在Mozilla運行它的網頁不斷加載如何停止我應該用break語句？但是哪裏？ @Jonas w –

@rock stone所以你想限制結果？ –

您無法將整個歌曲對象寫入文檔。你應該首先將其映射：

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

這會給你所有的名字（字符串），你可以寫入文件的數組：

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

來源

2017-06-03 16:52:02

您需要使用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>');

來源

2017-06-03 16:52:46 EyuelDK

您需要字符串化的對象，使其可讀。

<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>

來源

2017-06-03 16:54:40 n33rma

來自請求的響應是一個json對象數組，您只是試圖一遍又一遍地寫入返回對象。您需要迭代返回的數據並輸出每個對象的值。改變你的showdata功能爲：

function showdata(data){ 


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

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

     } 
    }

來源

2017-06-03 16:55:12 Siddharth

我應該如何循環瀏覽這個JSON數據？

回答

相關問題