javascript - 将 Javascript 对象的内容附加到 HTML

Question

试图解决我遇到的这个小问题..

我正在使用 parse.com 来存储和检索数据，并且我有一个 JSON 对象，我正在尝试检索其中的一部分以附加到 HTML

var tempObject = Parse.Object.extend("Dev");
var query = new Parse.Query(tempObject);
query.notEqualTo("objectId", "Dan Stemkoski");
query.find({
success: function(results) {
alert("Successfully retrieved " + results.length + " receipts");
for (var i = 0; i < results.length; i++) { 
var object = results[i];
$("#receipts").html(object.get('receipt_title'));
console.log(object)
//alert(object.id + ' - ' + object.get('receipt_title'));`

我想要显示的结果

<div id = receipts>
<div>

不幸的是，由于某种原因，我只得到了一行，而不是我应该得到的 10 行。我知道我应该以某种方式循环以获得结果，但到目前为止我所有的尝试都失败了。

预先感谢您的帮助!

Answer 1

您需要将结果添加到 html 中，因为现在您只需将前一个结果替换为下一个结果即可。而不是

$("#receipts").html(object.get('receipt_title'));

尝试

var html = $("#receipts").html();
$("#receipts").html(html + object.get('receipt_title'));

另外，顺便提一下，如果你想提高效率，最好只继续添加变量并只写入 DOM 一次。所以:

var html = "";
for(/* Do your for loop here, thats all correct*/){
    /*Do everything the same apart from the $("#receipts").html() line*/
    html += object.get('receipt_title');
}
$("#receipts").html(html);

修改 DOM 的次数越少越好。