javascript - jQuery: tr に td 要素を追加する

Question

変数を使用しrowてデータを動的に取得し、テーブル行を設定します。

var row = '<tr>'+
      '<td>'+obj.Message+'</td>'+
      '<td>'+obj.Error+'</td>'+
      '<td>'+obj.Detail+'</td>'+
      '</tr>';

値に基づいて、行オブジェクトに別の値を追加しようとしましたが、機能<td>しませんでした。

if(obj.Type=='Error') {
  $(row).find('td:last').append('<td>'+ obj.ErrorCode+'</td>');
}
$('table> tbody:last').append(row);

最初に行に追加しようとしました<td>が、うまくいきませんでした。

$(row).append('<td>'+ obj.ErrorCode+'</td>');

Answer 1

最後の行を保存していません。

呼び出すと$(row).find(...).append(...)、結果は変数に格納されません。最善の解決策は、おそらく最初から jQuery オブジェクトを保持することです。

//         v--- use a jQuery object here
var $row = $('<tr>'+
      '<td>'+obj.Message+'</td>'+
      '<td>'+obj.Error+'</td>'+
      '<td>'+obj.Detail+'</td>'+
      '</tr>');    
if(obj.Type=='Error') {
    $row.append('<td>'+ obj.ErrorCode+'</td>');
}
$('table> tbody:last').append($row);

フィドルを見る

Answer 2

あなたはここで間違いを犯しました：

 obj.Type='Error' 

(=) ここで代入演算子として機能します。

確認する

  if(obj.Type=='Error'){
   //hence code.
  }

Answer 3

rowDOM を検索して別の DOM を追加する前に、DOM に追加する必要はありません<td>か?

解決策 1

var row = '<tr>'+
          '<td>'+obj.Message+'</td>'+
          '<td>'+obj.Error+'</td>'+
          '<td>'+obj.Detail+'</td>';

if(obj.Type=='Error') {
    row += '<td>'+ obj.ErrorCode+'</td>';
}

row += '</tr>';

$('table> tbody:last').append(row);

解決策 2

var row = '<tr>'+
          '<td>'+obj.Message+'</td>'+
          '<td>'+obj.Error+'</td>'+
          '<td>'+obj.Detail+'</td>'+
          '</tr>';

$('table').append(row);

if(obj.Type=='Error') {
    $('table').find('td:last').after('<td>'+ obj.ErrorCode+'</td>');
}

解決策 3

var row = '<tr>'+
          '<td>'+obj.Message+'</td>'+
          '<td>'+obj.Error+'</td>'+
          '<td>'+obj.Detail+'</td>'+
          '</tr>';

$('table').append(row);

if(obj.Type=='Error') {
    $('table tr').append('<td>'+ obj.ErrorCode+'</td>');
}