如何使用javascript / jquery打印数据

Question

I have the next js code.

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:[]};

}

Now to print the results from myData with a specific way.In the first line myData[0].displayName.Next lines all the myData[i].displayNameEvents that indicates to the myData[0].displayName and all the myData[i].displayNameArtist.After that it will print the next myData[1].displayName and so goes on.

Below is how i tried to print them.

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

If this is just for debugging, use JSON.stringify(myData) to parse your data into a JSON string. This way you'll have both the property name and value right next to eachother.

Then use console.log or div.innerText to write the text out.

For example, assuming you have a div with the class 'output':

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

You can also open your debugger console and view the console output with:

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

In the myData array above, two elements are being pushed for each object.

• one object, which has id and displayName properties
• second object with displayNameEvent and displayNameArtist array

As there is no relation between these two array elements, we cannot print the data corrrectly, displayName with its associated diasplayNameEvents and displayNameArtists.

I have rewritten the above code with some dummy data in JsFiddle . The code associates the id / displayName with displayNameEvent / displayNameArtist arrays and prints the data correctly as shown below.

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

...