使用 javascript/jQuery 在每第五行之后附加表格行

发布于 2024-12-14 21:01:15 字数 1448 浏览 3 评论 0原文

我需要在表中的每 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>

I need to append a table row count after every 5th row in a table. How can I do this without using server side programming? jQuery or regular javascript is fine!

I would like this 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>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>

To become this:

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

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

深海夜未眠 2024-12-21 21:01:15

在这里你

$("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>")
});

here you are

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

update

or even beter

$("table tr:nth-child(5n)").each(function() {
    $(this).after("<tr><td>--"+$("td", this).text()+"th--</td></tr>")
});
阳光下的泡沫是彩色的 2024-12-21 21:01:15

尝试 -

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

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

Try -

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

Demo - http://jsfiddle.net/SZpuh/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文