jQueryオブジェクト内のデータをデータテーブルにバインドする方法は？

Question

私は、ソースコードを検索した後、要素の名前とそのIDをリストするプログラムを記述しようとしています。私は以下のスクリプトを使用して名前を見つけ、アラートポップアップとして表示しています。私はそれをポップアップではなくデータテーブルの内部に表示したい。

<script> 
     var $textarea = $('#TextArea1'), $submit = $('#Submit1'); 
     $submit.click(function (e) { 
      e.preventDefault(); 
      sourceCode = $textarea.val(); 
      var $searchObject = $('<div id="Searching"></div>'); 
      $searchObject.append($(sourceCode)); 

    alert("Number of Submit Buttons = " + $searchObject.find('[type=submit]').length); 
       $searchObject.find('[type=submit]').each(function() { 
        alert("Name of Submit button = " + $(this).attr("name")); 
        alert("ID of Submit button = " + $(this).attr("id")); 
       }); 
</script> 

は、私は、クライアント側でこのようなテーブルがあるとします。

<table style="width:100%;" frameborder="0"> 
      <tr> 
       <th>Element </th> 
       <th>Element name</th> 
       <th>Element ID</th> 
      </tr> 
      <tr> 
       <td></td> 
       <td></td> 
       <td></td> 
      </tr> 
      <tr> 
       <td></td> 
       <td></td> 
       <td></td> 
      </tr> 
     </table> 

誰もがテーブルにデータを追加するループで私を助けることはできますか？

Answer 1

単純に新しい行を追加する場合は、次のようにします。必要に応じて、管理を簡素化したり、管理しやすくすることができます。例えば、クラスを追加したい場合は、個別のtd要素を作成してください。

var table = $("table-selector"); 
$searchObject.find('[type=submit]').each(function() { 
        var newTr = $.parseHTML("<tr><td></td><td>"+$(this).attr("name")+"</td><td>"+$(this).attr("id")+"</td></tr>"); 
        $(table).append(newTr); 
        alert("Name of Submit button = " + $(this).attr("name")); 
        alert("ID of Submit button = " + $(this).attr("id")); 
       });