追加到DOM與AJAX，數據顯示爲字符串，而不是HTML

Question

我想追加通過AJAX請求檢索數據到DOM，所以我可以抓住它，並把它放入一個數組。但是，當我將數據追加到DOM中時，它顯示爲一個字符串而不是HTML。我的代碼附加到DOM下面，謝謝！

var url = "https://xxxxxxx.com"; 
var $storeData = document.getElementById("data"); 

$.getJSON(url, function(data) { 
    var checkins = data.response.venues[0].stats.checkinsCount; 
    var formattedCheckins = Number(checkins); 
    $storeData.append('<p class="getData">' + formattedCheckins + '</p>') 
}); 

我試圖用這個上JSON.stringify的formattedCheckins變量以及類似的結果。謝謝你的幫助！

Answer 1

你的問題是document.getElementById正在返回一個本地DOM元素。使用該對象的append()方法將文本放置在元素內，而不是HTML。你似乎混淆了jQuery的append()方法，它會添加HTML。

爲了解決這個問題，使用jQuery，而不是選擇#data元素：如果您使用jQuery

var $storeData = $("#data"); 
 

 
var formattedCheckins = 12345; 
 
$storeData.append('<p class="getData">' + formattedCheckins + '</p>')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="data"></div>

Answer 2

，嘗試var $storeData = $("#data");代替。

document.getElementById返回一個DOM對象。

var storeData = $('#data')返回一個jQuery對象。