带有数组和循环的 Javascript 表 - 损坏答案

【问题标题】：Javascript Table with Arrays and Loops - Broken带有数组和循环的 Javascript 表 - 损坏
【发布时间】：2015-06-01 11:00:34
【问题描述】：

使用带有 for 循环的 1 维和 2 维数组的破碎表。

如何让“loanAmount[row] 在表格的最左侧列仅显示一次？

  function print2DArrayTable(this2DArray, title)
   {
   //Creates the header of the table
   document.write("<table border='1' cellpadding='5'>");
   document.write("<tr><th colspan='8'>");
   document.write("<h2>" + title + "</h2>");
   document.write("</th></tr>")


      //Creates the Year headers on top of the table columns.
      document.write("<th></th>");
      for(x=0; x<numberOfYear.length; x++)
      {
         document.write("<th>" +numberOfYear[x]+ "</th>");
      }


      for(row=0; row<this2DArray.length; row++)
      {  
         document.write("<tr>");
         for(col=0; col<this2DArray[0].length; col++)
         {
            document.write("<td>"+loanAmount[row]+"</td>");
            document.write("<td>");
            document.write(this2DArray[row][col] + "&nbsp;&nbsp;");
            document.write("</td>");
         }
         document.write("</tr>");

      }
      document.write("</table>");
   }/* end of print2DArraytable */

第一列是正确的。但其他的都不是.. 这是它的图片。

【问题讨论】：

标签： javascript arrays loops html-table

【解决方案1】：

将生成第一列的行移到内部循环之外。

for(row=0; row<this2DArray.length; row++)
  {  
     document.write("<tr>");

     // We only want to do this once per row
     document.write("<td>"+loanAmount[row]+"</td>");

     // After writing out the first column, write out the rest
     for(col=0; col<this2DArray[0].length; col++)
     {

        document.write("<td>");
        document.write(this2DArray[row][col] + "&nbsp;&nbsp;");
        document.write("</td>");
     }
     document.write("</tr>");

  }

【讨论】：