Question

我需要做我的作业，它很简单，一切都是正确的，但只是表类不起作用..当它执行时，表出现，但没有类特征（如边框颜色，宽度等））。

我该如何解决这个问题？

function Gerar() {
  if (Entrada.C.value < 0 || Entrada.C.value > 10 || Entrada.L.value < 0 || Entrada.L.value > 10)
    alert("As colunas e linhas devem ser positivas e menores que 10 (dez)");
  else {
    var C, L, contl = 0,
      contc = 0;

    L = Entrada.L.value;
    C = Entrada.C.value;

    document.write("<table class='Tabela'>");

    for (i = 0; i < L; i++) {
      document.write("<tr>");

      contl += 1;

      for (j = 0; j < C; j++) {
        contc += 1;
        document.write("<td> " + contc + "," + contl + " </td>");
      }

      j = 0;

      document.write("</tr>");

      contc = 0;
    }

    document.write("</table>");
  }
}

.Tabela {
  border-color: blue;
  border-style: solid;
  border-width: 4px;
}

<form id="Entrada">
  <table>
    <tr>
      <td>Coluna:</td>
      <td><input type="text" name="C" size="1" /></td>
    </tr>
    <tr>
      <td>Linha:</td>
      <td><input type="text" name="L" size="1" /></td>
    </tr>
    <tr>
      <td colspan="2" align="center"><input type="button" value="Ok" onclick="Gerar();" /></td>
    </tr>
  </table>
</form>

Answer 1

您应该使用DOM而不是将标记写入字符串。

所以这是基于DOM的解决方案的一个例子：

function createTable(intRows, intColomns)
{
    var objTable = document.createElement("table");
    objTable.setAttribute("class", "Tabela") // Here goes your class to make the css work
    for (var i = 0; i < intRows; i++) {
        var objRow = document.createElement("tr")
        for (var j = 0; j < intColomns; j++) {
            var objColomn = document.createElement("td")
            objColomn.innerHTML = j + ", " + i;
            objRow.appendChild(objColomn);
        }
        objTable.appendChild(objRow);
    }
    document.body.appendChild(objTable);
}

您还应该将输入从“name”更改为“id”以使其唯一

你的“确定”按钮看起来不像这样：

<input type="button" value="Ok" onclick="createTable(document.getElementById('L').value, document.getElementById('C').value);" />

如果您真的想保留document.write（）（我不推荐），您可以使用内嵌式解决方案：

document.write("<table style='border-color: blue; border-style: solid; border-width: 4px;'>");

而不是

 document.write("<table class='Tabela'>");

由javascript生成的表类不起作用

1 个答案: