Question

我有以下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流体布局。

Answer 1

你可以使用每个：

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

如何动态移动到新创建的<div>？</div>

1 个答案: