jQuery表重建

Question

我们有一张桌子：

<table>
<tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td>8</td>
    <td>9</td>
    <td>10</td>
</tr>
</table>

我们通过仅将3个 <td>放入每个<tr>更新此表。

它必须看起来像：

<table>
<tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
</tr>
<tr>
    <td>4</td>
    <td>5</td>
    <td>6</td>
</tr>
<tr>
    <td>7</td>
    <td>8</td>
    <td>9</td>
</tr>
<tr>
    <td>10</td>
</tr>
</table>

我们应该怎么做？

Answer 1

您可以使用.unwrap() .slice()和.wrapAll()来做到这.unwrap() ，如下所示：

var elems = $("table tr td").unwrap();
for(var i = 0; i < elems.length; i+=3) {
  elems.slice(i, i+3).wrapAll("<tr></tr>");
}​

您可以在此处查看一个快速演示 ，它使用<td>元素，删除周围的<tr></tr> ，将它们分成3组，然后将这些组重新包装在<tr></tr> 。