如何使用javascript / jquery打印數據

Question

我有下一個js代碼。

var myData=[];
for(j=1;j<=Pages;j++)
{
$.ajax({
        type: 'get',
        url: 'link.xml'+j,
        async: false, 
        dataType: 'xml', 
        success: function(data){
            getData(data);
        }, 
        error: function(data){
            console.log("error");
        }
    });
}
function getData(data){


     var tmpData = {id:'' , displayName:''};  

     //taking the values and storing them to myData


            myData.push(tmpData); 
            tmpData = {id:'' , displayName:'', eventsHref: []};


}


    for(i=0;i<myData.length;i++)
    {
     $.ajax({
        type: 'get',
        url: 'somelink'+data[i].id,
        async: false, 
        dataType: 'xml', 
        success: function(events){
            getUpEvents(events);
        }, 
        error: function(events){
            console.log("error");
        }
    });
    }
    function getUpEvents(events){

    var tmpEvents = {displayNameEvent:[] , displayNameArtist: []};

     //taking some other values and storing them to myData

     myData.push(tmpEvents); 
     tmpEvents = {displayNameEvent:[] , displayNameArtist:[]};

}

現在以特定方式打印myData的結果。在第一行myData [0] .displayName。接下來的行中，所有指示myData [0] .displayName和所有myData [i]的myData [i] .displayNameEvents .displayNameArtist。之后，它將打印下一個myData [1] .displayName，依此類推。

以下是我嘗試打印它們的方式。

for(i=0;i<myData.length;i++)
{
        document.write(myData[i].displayName+"<br>");
        document.write(myData[i].displayNameEvent+"<br>");
        document.write(myData[i].displayNameArtist+"<br>");
}

Answer 1

如果這僅用於調試，請使用JSON.stringify(myData)將您的數據解析為JSON字符串。 這樣，您將使屬性名稱和值彼此相鄰。

然后使用console.log或div.innerText將文本寫出。

例如，假設您有一個帶有“輸出”類的div：

$('.output').text(JSON.stringify(myData));

您還可以打開調試器控制台，並使用以下命令查看控制台輸出：

console.log(JSON.stringify(myData));

Answer 2

//Create a div to hold the results
var results = $("<div/>");

//Loop through the data and append each value wrapped in a p to the div
for(i=0;i<myData.length;i++)
{
        results.append("<p>" + myData[i].displayName + "</p>");
        results.append("<p>" + myData[i].displayNameEvent + "</p>");
        results.append("<p>" + myData[i].displayNameArtist + "</p>");
}

//append the div to the body
$("body").append(results);

Answer 3

在上面的myData數組中，為每個對象推送了兩個元素。

• 一個具有id和displayName屬性的對象
• 第二個具有displayNameEvent和displayNameArtist數組的對象

由於這兩個數組元素之間沒有關系，因此我們無法正確打印數據displayName及其關聯的diasplayNameEvents和displayNameArtists。

我已經在JsFiddle中用一些偽數據重寫了上面的代碼。 該代碼將id / displayName與displayNameEvent / displayNameArtist數組相關聯，並正確打印數據，如下所示。

101s name

101s event1, 101s event2

101s artist1, 101s artist2


102s name

102s event1, 102s event2

102s artist1, 102s artist2


103s name

103s event1, 103s event2

103s artist1, 103s artist2

...