2010-06-16 5 views
0

Nous avons une table:Table jQuery reconstruction

<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> 

Nous mettons à jour cette table en jetant dans chaque <tr> que <td>.

Il doit ressembler à:

<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> 

Comment pouvons-nous faire?

Répondre

2

Vous pouvez le faire en utilisant .unwrap(), .slice() et .wrapAll(), comme ceci:

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

You can view a quick demo here, cela prend les <td> éléments, supprime l'eux <tr></tr>, des groupes autour dans des ensembles de 3 et re-enveloppe les groupes dans <tr></tr>.