使用Parse.com填充Javascript表格的HTML表格

Question

我正在創建一個簡單的HTML網站，其中包含表格中顯示的iOS應用程序的數據。我使用Parse.com作爲我的移動數據，我將使用Javascript將其顯示在網站上。

我以前開發過一個基於JSP的網站，但這次我使用的是Wordpress的Javascript插件，所以我不能使用JSP文件。因此，我需要處理HTML代碼中的所有內容。

有沒有辦法將下面的Parse.com查詢獲取到HTML表格中？

var GameScore = Parse.Object.extend("GameScore"); 
var query = new Parse.Query(GameScore); 
query.equalTo("playerName", "Dan Stemkoski"); 
query.find({ 
    success: function(results) { 
    alert("Successfully retrieved " + results.length + " scores."); 
    // Do something with the returned Parse.Object values 
    for (var i = 0; i < results.length; i++) { 
     var object = results[i]; 
     alert(object.id + ' - ' + object.get('playerName')); 
    } 
    }, 
    error: function(error) { 
    alert("Error: " + error.code + " " + error.message); 
    } 
}); 

Answer 1

爲要顯示此數據的頁面創建自定義頁面模板。例如在Wordpress Admin中創建一個名爲'score-table'的頁面，然後在主題'page-score-table.php'中創建一個頁面模板。

如果需要的話，在頁面和jQuery中包含解析庫腳本（儘管這應該由Wordpress加載），然後使用類似的東西。

<table id="results-table"> 
<tr> 
    <th>User Name</th> 
    <th>Score</th> 
</tr> 
</table> 

...

<script> 
Parse.initialize("Your", "Credentials"); 

var GameScore = Parse.Object.extend("GameScore"); 
var query = new Parse.Query(GameScore); 
query.equalTo("playerName", "Dan Stemkoski"); 
query.find({ 
    success: function(results) { 
     for (var i = 0; i < results.length; i++) { 
      var object = results[i]; 
       (function($) { 
        $('#results-table').append('<tr><td>' + object.get('playerName') + '</td><td>' + object.get('score') + '</td></tr>'); 
       })(jQuery); 
     } 
    }, 
    error: function(error) { 
     alert("Error: " + error.code + " " + error.message); 
    } 
}); 
</script> 

Fiddle showing it HERE，建立一個虛擬解析表給你看。

其實這種替換成功的功能，相信追加是相當昂貴的，如果你有很多行...

... 
///before query.find(); 
var myScores=''; 
... 
success: function(results) { 
for (var i = 0; i < results.length; i++) { 
    var object = results[i]; 
    myScores+='<tr><td>' + object.get('playerName') + '</td><td>' + object.get('score') + '</td></tr>'; 
} 
    (function($) { 
     $('#results-table').append(myScores); 
    })(jQuery); 
}