使用for循环生成HTML表格 [英] Generate Html table using for loop

问题描述

请为以下提到的情况提供帮助->

Please help with below mentioned scenario->

我想在表格中显示从1到30的值，这样一个标签中应该没有1,2,3，而在其他tr标签中应该明智地有4,5,6，以此类推，直到30值.我想使用表格在表格的元素中显示值.其中每个值如"1"应显示为一个，任何"2"应显示为不同的<TD>，依此类推.

I am having wanna display values from 1 to 30 in a table such a way that nos 1,2,3 should come in one tag and like wise 4,5,6 in other tr tag ans so on till 30 value. I wanna use table for displaying values in a element of a table. wherein each value like "1" should display in one , no "2" should display in different <TD> and so on.

我的意思是说值"1"应该显示在<Table>标签的单个<TD>中，值"2"应该显示在另一个<td>标签中，依此类推，并且在随后的三个<TD>之后■应该使用一个<Tr>.输出应如下所示->

I mean to say that value "1" should be displayed in single <TD> of <Table> tag ,value "2" should be displayed in another <td> tag and so on ,Also after three subsequent <TD>s one <Tr> should be used. Output should be as folllows ->

1 2 3 
4 5 6
7 8 9

以此类推！

早期的响应将不胜感激.谢谢.

Early response would be much appreciated. Thanks.

我尝试了下面给出的代码

I have tried Code as given below,

<script type="text/javascript">

    document.write("        <table width='673' align='center' cellpadding='2' cellspacing='1'>");
    document.write("            <tr>");
    document.write("    <td valign = 'top'>");
    document.write("                </td>");

    document.write("            </tr>");

    var cnt = 0;
    for (var idx = 1; idx <= 30; idx++) 
    {
        cnt = cnt + 1;
        document.write("            <tr>");
            document.write("    <td valign = 'top'>");
            document.write("        <table width='100px' align='center' cellpadding='2' cellspacing='1'>");
            document.write("            <tr>");
            document.write("                <td align='center'>");
            document.write("                   " + idx + "");
            document.write("                </td>");
            document.write("            </tr>");
            document.write("            <tr>");
            document.write("                <td class='label'>");
            document.write("                    <span> name part : " + idx + "</span>");
            document.write("                </td>");
            document.write("            </tr>");
            document.write("            </table>");
            document.write("                </td>");
            if (cnt = 3) 
            {
                document.write("            </tr>");
            }
            if (cnt = 3) {
                cnt = 0;
            }

        }

    document.write("            </table>");
</script>

推荐答案

您可以尝试执行以下操作:

You can try something like this:

var mytable = "<table cellpadding=\"0\" cellspacing=\"0\"><tbody><tr>";

for (var i = 1; i < 31; i++) {
  if (i % 3 == 1 && i != 1) {
    mytable += "</tr><tr>";
  }
  mytable += "<td>[" + i + "]</td>";
}

mytable += "</tr></tbody></table>";

document.write(mytable);

这是 jsFiddle演示

这篇关于使用for循环生成HTML表格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！