Question

我正在使用jquery append方法在<tr>中添加<tbody>。我必须得到以下表结构

<table>
   <tbody>
     <tr>
        <td>
       <div>
               <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <td width="33%"></td>
                      <td width="4%">:</td>
                      <td width="63%"></td>
                 </tr>
              </table>
         </div>
      </td> 
      <td>
       <div>
               <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <td width="33%"></td>
                      <td width="4%">:</td>
                      <td width="63%"></td>
                 </tr>
              </table>
         </div>
      </td> 
      <td>
       <div>
               <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <td width="33%"></td>
                      <td width="4%">:</td>
                      <td width="63%"></td>
                 </tr>
              </table>
         </div>
      </td> 
    </tr>
    <tr>
        <td>
       <div>
               <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <td width="33%"></td>
                      <td width="4%">:</td>
                      <td width="63%"></td>
                 </tr>
              </table>
         </div>
      </td> 
      <td>
       <div>
               <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <td width="33%"></td>
                      <td width="4%">:</td>
                      <td width="63%"></td>
                 </tr>
              </table>
         </div>
      </td> 
      <td>
       <div>
               <table width="100%" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                      <td width="33%"></td>
                      <td width="4%">:</td>
                      <td width="63%"></td>
                 </tr>
              </table>
         </div>
      </td> 
    </tr>
  </tbody>
</table>

我必须动态地在<tr>及其内容中添加一个类。我通过jquery append方法做到这一点。但问题是，在追加第一个<tr>后附加<td>时，<tr>即被关闭。我需要在<td>内插入三个<tr>并关闭它。那么这段代码有什么问题呢？

Answer 1

使用.append()您没有添加标记，您正在添加DOM对象。您想要做的是将<td>附加到新创建的<tr>，如下所示：

var tr = $('<tr>');

// Add the row to the table
$('table tbody').append(tr);

// Add cells to the new row
tr.append('<td>1</td>');
tr.append('<td>2</td>');
tr.append('<td>3</td>');

Answer 2

    $('#tb tbody tr').first().append(' <td>  add td  </td>'); 

    $('#tb tbody').append('<tr><td>  add tr  </td></tr>');

附加到表的Jquery意外关闭标记

2 个答案: