データjsonをhtml（テーブルではない）に保存することが可能です

Question

jsonからデータhtmlを表示することは可能ですか？ 私は例を持っていますが、テーブルのためだけです。

私はJSONからHTMLに/負荷データを表示したい

<table id="tables" 
data-url="comments.php" 
data-row-style="rowStyle" 
data-toggle="table" 
data-show-refresh="true" 
data-show-toggle="true" 
data-show-columns="true" 
data-search="true" 
data-select-item-name="toolbar1" 
data-pagination="true" 
data-sort-name="name" 
data-sort-order="desc"> 
<thead> 
<tr> 
<th data-field="name" data-sortable="true" data-align="left">Name</th> 
<th data-field="comments" data-sortable="true" data-align="left">comments</th> 
</tr> 
</thead> 
<tr> 
</tr> 
</table> 

：

<h3>name</h3>//data from json 
<p>comments</p>//data from json 

comments.php

<?php 
header('content-type:application/json'); 
include 'connection.php'; 

$select = mysql_query("select * from comments"); 
$row=array(); 

while($row=mysql_fetch_array($select)) 
{ 
    $arrayx=array( "comments"=>$row['comments'], 
        "name"=>$row['name']); 

    $rows[] = $arrayx; 

} 
echo json_encode($rows); 
?> 

私はそのような例のJSONを持っている...

Answer 1

それができます尋ねると、あなたのHTMLのインラインになることはありません。

しかし、jQueryの.get()を使用して、それがこの方法を行うことができます。

HTML：

<h3 id="jsonName"></h3><!--data from json will be here --> 
<p id="jsonComments"></p><!--data from json will be here --> 

jQueryのスクリプト：

$.get("comments.php","",function(data){ 
    $("#jsonName").html(data.name); 
    $("#jsonComments").html(data.comments); 

    //To look at the received json 
    console.log(JSON.stringify(data)); 
},"json"); 

あなたのJSONは多くのオブジェクト...使用のクラスを持っている場合idsの代わりに。
データをループスルーします。