如何动态移动<tr>进入一个新创建的

How to dynamically move <tr> into a newly created <div>?

本文关键字:一个 新创建 创建 tr 动态 何动态 移动      更新时间:2023-09-26

我有以下HTML结构:

<table id="j_idt28:innerContent" class="innerContent">
    <tbody>
      <tr>
      <tr>
      <tr>
      <tr>
      .......
      <tr>
      <tr>
    </tbody>
</table>

使用解析后的XML响应填充标记。

我通常有20个左右的tr标签。我想在第4,第8,第12等标签之后创建一个并将4个标签插入其中。

这是目前为止我的jquery:

var i = 1;
var j = 2;
var margin = 0;
var max = $('.innerContent tr').length;
  for(i = 1; i<=max; i++)
  {
  var child1 =  i - 3;
  var child2 =  i - 2;
  var child3 =  i - 1;
  var hotel1 =  $('.innerContent tr:nth-child('+child1+')');
  var hotel2 =  $('.innerContent tr:nth-child('+child2+')');
  var hotel3 =  $('.innerContent tr:nth-child('+child3+')');
  var hotel4 =  $('.innerContent tr:nth-child('+i+')');
    if(i%4 == 0)
    {
    $('.innerContent tbody').prepend('<div class="line_wrapper"></div>');
    $('.line_wrapper').append(hotel1,hotel2,hotel3,hotel4);
}
  }
  for(j =2; j<=max ;j++)
  {
  var hotel =  $('.innerContent tr:nth-child('+j+')');
    margin = margin + 280;
    hotel.css('margin-left',margin+'px');
    //$('.line_wrapper').append(hotel);
  }

这并不像我所期望的那样工作。我想添加div以便使用bootstrap流体布局

您可以使用each:

$('#mytable tr').each(function (i) {
    i%4?$(this).prev('div').append(this):$(this).wrap('<div/>');
});