使用javascript / jQuery在每第五行后追加表行

时间:2011-11-10 12:27:38

标签: javascript jquery append tablerow

我需要在表格的每第5行后附加一个表行计数。如何在不使用服务器端编程的情况下执行此操作? jQuery或普通的javascript很好!

我想要这张表:

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

成为这个:

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

2 个答案:

答案 0 :(得分:8)

你在这里

$("table tr:nth-child(5n)").after("<tr><td> new row </td></tr>")

<强>更新

甚至更好

$("table tr:nth-child(5n)").each(function() {
    $(this).after("<tr><td>--"+$("td", this).text()+"th--</td></tr>")
});

答案 1 :(得分:0)

尝试 -

$("table tr:nth-child(5n)").after("<tr><td>--added--</td></tr>")

演示 - http://jsfiddle.net/SZpuh/