如何以正確的方式顯示JavaScript響應？

Question

下面是調用服務器API我的JavaScript代碼：

<script type='text/javascript'> 
    call_juvlon_api(apikey, 'getAvailableCredits', '', function(response) { 
    document.getElementById('show').innerHTML=response; 
    }); 
</script> 

當我打印的HTML標記的響應：

<h1 id='show'></h1> 

我得到這種格式的結果：

{"code":"200","status":"Success:Mail Credit Details","Mail Credits":"46"} 

但我想要的是這樣的結果：

<h1>code:200</h1> 
<h1>status:Success:Mail Credit Details</h1> 
<h1>Mail Credits:46</h1> 

我嘗試以下，但沒有任何顯示：

var obj=['show'] 

var tbl=$("<table/>").attr("id","mytable"); 
$("#div1").append(tbl); 
for(var i=0;i<obj.length;i++) 
{ 
    var tr="<tr>"; 
    var td1="<td>"+obj[i]["code"]+"</td>"; 
    var td2="<td>"+obj[i]["status"]+"</td>"; 
    var td3="<td>"+obj[i]["color"]+"</td></tr>"; 

    $("#mytable").append(tr+td1+td2+td3); 
} 

Answer 1

首先，你需要3個H1元素，所以「秀」元素變成這樣一個div;

<div id='show'></div> 

然後在你的javascript代碼中，通過它們的名字訪問響應元素就像這樣;

<script type='text/javascript'> 
    call_juvlon_api(apikey, 'getAvailableCredits', '', function(response) { 
    var obj = JSON.parse(response); 
    for(var prop in obj) { 
     document.getElementById('show').innerHTML += '<h1>' + prop + ":" + obj[prop] + '</h1>'; 
    } 
});