テーブルの最後の列を辞書オブジェクトで更新するにはどうすればいいですか？

Question

私は最後に別の列を追加したい

<table id="example"> 
<tr> 
    <td>Title</td> 
    <td>T1</td> 
</tr> 
<tr> 
    <td>Description</td> 
    <td>D1</td> 
</tr> 
</table> 

、すべての行の最後の列には、次の動的に生成された辞書のキー値pair.Theが私のテーブル構造であると交換する必要のあるテーブルを持っています各行の どうやって意志ただ、このように、

<table id="example"> 
<tbody> 
<tr> 
    <td>Title</td> 
    <td>T1</td> 
    <td>T2</td> 
</tr> 
<tr> 
    <td>Description</td> 
    <td>D1</td> 
    <td>D2</td> 
</tr> 
</tbody> 
</table> 

私は私と一緒に

のvarのdict = {：： "T2"、 "T2"、 "D2" "T1" を}この入力を持っていますそれはJQueryを使用してですか？

Answer 1

それは、次のコードを使用して実装することができ、

var dict = { 
 
      "t1": "T2", 
 
      "t2": "D2" 
 
      } 
 
var count = 0; 
 
$.each (dict, function (field, value) { 
 
    $('#example tr').each(function() { 
 
     if($("tr").index(this) == count){ 
 
       $(this).find('td:last').after('<td>' + value + '</td>'); 
 
      } 
 
     }); 
 
    count++; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<table id="example"> 
 
    <tr> 
 
     <td>Title</td> 
 
     <td>T1</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Description</td> 
 
     <td>D1</td> 
 
    </tr>

Answer 2

次のコードを使用する：あなたが最後に取得するlast()機能を使用することができます

// append the <td> inside each found <tr> in the table 
$("#example > tr").each(function(index){ 
    $(this).append("<td>" + value[index] + "</td>"); 
}); 

Answer 3

をtdすべてtrでjを使用して;）

var dict = { 
 
    "t1": "T2", 
 
    "t2": "D2" 
 
} 
 
var index = 0; 
 

 
function start() { 
 
    var x = $('#example tr') 
 
    for (i = 0; i < x.length; i++) { 
 
    row = x[i] 
 
    var valInDic = index == 0 ? dict.t1 : dict.t2; 
 
    index++; 
 
    $(row).append('<td>' + valInDic + '</td>') 
 
    if (index == 2) 
 
     index = 0; 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="example"> 
 
    <tbody> 
 
    <tr> 
 
     <td>Title</td> 
 
     <td>T1</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Description</td> 
 
     <td>D1</td> 
 
    </tr> 
 

 
    </tbody> 
 
</table> 
 
<button onclick=start() ">Start</button>

私はこのことができます願っています：このようなクエリセレクタ