Question

我刚刚开始创建一些创建带有x行的表的东西，您可以在行中放入任意多列。每当我尝试运行它时，它只会创建一个单元。我该如何解决？

var xio = parseInt(prompt("How many weighted areas are in this subject?"))

for (i = 5; xio > 0; xio--) {


  var table = document.getElementById("myTable");
  var row = table.insertRow(0);
  var cell1 = row.insertCell(0);
  cell1.innerHTML = "NEW CELL1";

  var firstRow = document.getElementById("myTable").rows[xio];
  var x = firstRow.insertCell(0);
  x.innerHTML = "New cell";


}

<table id="myTable"></table>

Answer 1

您可以使用以下功能轻松创建表格

function makeTableHTML(myArray)
 { 
    var result = "<table border=1>"; 
    for(var i=0; i<myArray.length; i++) {
     result += "<tr>"; 
    for(var j=0; j<myArray[i].length; j++){ 
    result += "<td>"+myArray[i][j]+"</td>";
     } 
    result += "</tr>";
     } 
    result += "</table>"; 
    return result; 
    }

Answer 2

在您的代码中，您尝试选择table.rows[xio]，但如果选择xio === 5，则行号5尚不存在（因为它是迭代1），因此崩溃。

反之亦然。与其通过减少xio来循环，不如通过增加i来循环。

var xio = parseInt(prompt("How many weighted areas are in this subject?")),
  table = document.getElementById("myTable");

for (i = 0; i < xio; i++) {
  var row = table.insertRow(0),
    cell1 = row.insertCell(0);
  cell1.innerHTML = "NEW CELL1";
}

<table id="myTable"></table>

Answer 3

没有第二次输入的提示，因此即使您的其余代码正常（不是），也只能有一个单元格。至于单元格/列，您需要在创建行的循环内的一个循环中创建它们。请注意演示中循环语法的方式。

var rQty = parseInt(prompt("Number of Rows"), 10);
var cQty = parseInt(prompt("Number of Columns"), 10);
var table = document.getElementById("xTable");

for (let i = 0; i < rQty; i++) {
  var row = table.insertRow();
  for (let j = 0; j < cQty; j++) {
    var cell = row.insertCell();
    cell.textContent = "NEW CELL";
  }
}

td {
  border: 2px ridge #333;
  text-align: center;
}

<table id="xTable"></table>

Answer 4

var rQty = parseInt(prompt("Number of Rows"), 10);
var cQty = parseInt(prompt("Number of Columns"), 10);
var table = document.getElementById("xTable");

for (let i = 0; i < rQty; i++) {
  var row = table.insertRow();
  for (let j = 0; j < cQty; j++) {
    var cell = row.insertCell();
    cell.textContent = "NEW CELL";
  }
}

td {
  border: 2px ridge #333;
  text-align: center;
}

<table id="xTable"></table>

用Java递归创建表

4 个答案: