jQueryを使用してテーブルを描画

Question

現在、jQueryを使用してテーブルを描画しようとしていますが、動作していません。これは現在のjsコードです。私は追加を使用してみましたが、それはテーブルのために仕事をしませんでした。誰かが私にこれを助けることができますか？ありがとうございました。

(function(){ 
    var location = new Array(); 
    var query = '%23CM0655'; 
    var url = "search.php"; 
    $.post(url, {query:query}, function(tweets){ 
     console.log(tweets); 
     $("#tweetResult").html(""); 
     var geoEnabled = false; 
     var placeName = ""; 
     var countryName = ""; 
     for(var i=0; i<tweets.statuses.length; i++){ 
      var img = $("<img src='" + tweets.statuses[i].user.profile_image_url + "' class='tweetpic'/>"); 
      $("#tweetResult").append(img); 
      $("#tweetResult").append('<br/>'); 
      $("#tweetResult").append(tweets.statuses[i].user.screen_name); 
      $("#tweetResult").append(tweets.statuses[i].text + "<br/>"); 
      geoEnabled = tweets.statuses[i].user.geo_enabled; 
      if(geoEnabled){ 
       placeName = tweets.statuses[i].place.name; 
       countryName = tweets.statuses[i].place.country; 
       if(placeName != null){ 
        $("#tweetResult").append(placeName + ", "); 
        $("#tweetResult").append(countryName + "<br/>"); 
       } 
       $("#tweetResult").append("Location: " + tweets.statuses[i].place.bounding_box.coordinates[0][0][0] + ", "); 
       $("#tweetResult").append(tweets.statuses[i].place.bounding_box.coordinates[0][0][1] + "<br/>"); 
       $("#tweetResult").append(tweets.statuses[i].created_at); 
      } 
      $("#tweetResult").append("<br/><br/>"); 

     } 
    }); 

    setTimeout(arguments.callee, 10000); 
})(); 

現在、これは私がテーブル

<div id="here_table"> 
<table> </table> !!!!!!!!!! 
     <tr><td>result1</td></tr> 
     <tr><td>result2</td></tr> 
     <tr><td>result3</td></tr> 
</div> 

Answer 1

を作成するために、appendメソッドを使用した後、私はいくつかのサンプルデータ（すべてのプロパティを使用していなかった）の問題を複製し取得しています出力されます。しかし、これはどのように完了したかを示します。

ただ、下記のスニペットを実行したり、私が<table></table>要素がゼロから作成されたとして、あなたの現在の状況、にコードを編集し、このfiddleアウト

var tweets = { 
 
    statuses: [{ 
 
    place: { 
 
     name: "Oostend", 
 
     country: "Belgium" 
 
    }, 
 
    user: { 
 
     profile_image_url: "https://jsfiddle.net/img/logo.png", 
 
     screen_name: "John Doe", 
 
     geo_enabled: true 
 
    }, 
 
    text: "Hello world!", 
 
    created_at: "April 7th 2016" 
 
    }, { 
 
    place: { 
 
     name: "Veurne", 
 
     country: "Belgium" 
 
    }, 
 
    user: { 
 
     profile_image_url: "https://jsfiddle.net/img/logo.png", 
 
     screen_name: "Jane Doe", 
 
     geo_enabled: false 
 
    }, 
 
    text: "Geo is disabled for me", 
 
    created_at: "April 6th 2016" 
 
    }] 
 
} 
 

 

 
$("#tweetResult").html(""); 
 
var table = $("<table></table>"); 
 
var thead = $("<thead></thead>"); 
 
thead.append($("<th></th>").html("Some header")); 
 

 
var tbody = $("<tbody></tbody>"); 
 
var geoEnabled = false; 
 
var placeName = ""; 
 
var countryName = ""; 
 
for (var i = 0; i < tweets.statuses.length; i++) { 
 
    var row = $("<tr></tr>"); 
 
    var img = $("<td><img src='" + tweets.statuses[i].user.profile_image_url + "' class='tweetpic'/><br/></td>"); 
 
    row.append(img); 
 
    row.append($("<td></td>").html(tweets.statuses[i].user.screen_name)); 
 
    row.append($("<td></td>").html(tweets.statuses[i].text + "<br/>")); 
 
    geoEnabled = tweets.statuses[i].user.geo_enabled; 
 
    if (geoEnabled) { 
 
    placeName = tweets.statuses[i].place.name; 
 
    countryName = tweets.statuses[i].place.country; 
 
    if (placeName != null) { 
 
     row.append($("<td></td>").html(placeName + ", " + countryName)); 
 
    } 
 
    //row.append($("<td></td>").html("Location: " + tweets.statuses[i].place.bounding_box.coordinates[0][0][0] + ", " + tweets.statuses[i].place.bounding_box.coordinates[0][0][1] + "<br/>")); 
 
    row.append($("<td></td>").html(tweets.statuses[i].created_at)); 
 
    } 
 
    tbody.append(row); 
 
} 
 

 
table.append(thead).append(tbody); 
 
$("#tweetResult").append(table);

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

EDIT
チェック。