如何使用 javascript/jquery 打印数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20224114/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to print data using javascript/jquery
提问by user3014089
I have the next js code.
我有下一个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:[]};
}
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.
现在以特定方式从 myData 打印结果。在第一行 myData[0].displayName.Next 行所有 myData[i].displayNameEvents 指示 myData[0].displayName 和所有 myData[i] .displayNameArtist.After 它将打印下一个 myData[1].displayName 等等。
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>");
}
采纳答案by Kevin Bowersox
//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);
回答by Gopherkhan
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.
如果这只是为了调试，请使用JSON.stringify(myData)将您的数据解析为 JSON 字符串。这样，您将拥有彼此相邻的属性名称和值。
Then use console.logor div.innerTextto write the text out.
然后使用console.log或div.innerText将文本写出。
For example, assuming you have a div with the class 'output':
例如，假设您有一个带有“输出”类的 div：
$('.output').text(JSON.stringify(myData));
You can also open your debugger console and view the console output with:
您还可以打开调试器控制台并使用以下命令查看控制台输出：
console.log(JSON.stringify(myData));
回答by Sajad Deyargaroo
In the myData array above, two elements are being pushed for each object.
在上面的 myData 数组中，为每个对象推送两个元素。
- one object, which has id and displayName properties
- second object with displayNameEvent and displayNameArtist array
- 一个对象，它具有 id 和 displayName 属性
- 带有 displayNameEvent 和 displayNameArtist 数组的第二个对象
As there is no relation between these two array elements, we cannot print the data corrrectly, displayName with its associated diasplayNameEvents and displayNameArtists.
由于这两个数组元素之间没有关系，我们无法正确打印数据，displayName 及其关联的 diasplayNameEvents 和 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.
我已经用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
...
