Javascript 如何"；暂停“；动态绘制HTML表格时的页面刷新

我正在使用Javascript动态创建一个大表。 我已经意识到，随着行数的增加，添加新行所需的时间呈指数增长

我怀疑每行的每个循环中都会刷新页面（我还在每个单元格中添加文本类型的输入元素）

在我处理完整个表格之前，有没有办法停止页面“刷新”

有没有关于如何做到这一点或绕过它的建议

---

我已经尝试了上面的所有建议，但仍然遇到性能瓶颈

我试着一行接一行地分析，我注意到document.getElementById（）是表非常大时需要花费大量时间执行的行之一。 我使用getElementById（）动态访问加载在表的每个单元格上的文本类型的HTML输入

---

关于我应该使用哪种DOM方法来代替getElementById（），你有什么想法吗？

也许可以将你的表构建为一个大的HTML字符串，然后在完成后将容器div的.innerHTML设置为该字符串？

也许可以将你的表构建为一个大的HTML字符串，然后在完成后将容器div的.innerHTML设置为该字符串？

您可以创建表对象，而无需将其添加到文档树中，添加所有行，然后将表对象附加到文档树中

var theTable = document.createElement("table");
// ... 
// add all the rows to theTable
// ...
document.body.appendChild(theTable);

---

您可以创建表对象，而无需将其添加到文档树中，添加所有行，然后将表对象附加到文档树中

var theTable = document.createElement("table");
// ... 
// add all the rows to theTable
// ...
document.body.appendChild(theTable);

创建表时是否尝试过标记？ 浏览器可能会对此进行优化，并且在填充表格时不会“刷新”表格。

创建表格时是否尝试过该标记？

---

浏览器可能会对此进行优化，而不会“刷新”填充表格时将其显示。

如果每行的单元格大小相同，则您将能够指定样式

表格布局：固定

-这将为您提供最大的性能增益，因为浏览器不必在每次添加行时重新计算单元格大小

如果每行的单元格大小相同，则您将能够指定样式

表格布局：固定的

-这将为您提供最大的性能增益，因为浏览器不必在每次添加行时重新计算单元格大小

使用表格DOM循环行和单元格以填充行和单元格，而不是使用document.getElementByID（）来获取每个单独的单元格

E.g.
thisTable = document.getElementByID('mytable');//get the table
oneRow = thisTable.rows[0].cells; //for instance the first row
for (var colCount = 0; colCount <totalCols; colCount ++)
{
   oneCell =oneRow[colCount];
   oneCell.childNodes[0].value = 'test';//if your cell contains an input element
   oneCell.innerHTML = 'test'; // simply write on the cell directly
}

例如。
thisTable=document.getElementByID（'mytable'）//收拾桌子
oneRow=此表。行[0]。单元格//比如第一行
对于（var colCount=0；colCount使用表DOM循环行和单元格以填充它们，而不是使用document.getElementByID（）获取每个单独的单元格

E.g.
thisTable = document.getElementByID('mytable');//get the table
oneRow = thisTable.rows[0].cells; //for instance the first row
for (var colCount = 0; colCount <totalCols; colCount ++)
{
   oneCell =oneRow[colCount];
   oneCell.childNodes[0].value = 'test';//if your cell contains an input element
   oneCell.innerHTML = 'test'; // simply write on the cell directly
}

例如。
thisTable=document.getElementByID（'mytable'）；//获取表
oneRow=此表。行[0]。单元格；//例如第一行
对于（var colCount=0；colCount您使用哪种浏览器？它在其他浏览器中可复制吗？我只使用IE。在其他浏览器中未试用过…您使用哪种浏览器？它在其他浏览器中可复制吗？我只使用IE。在其他浏览器中未试用过…那么延迟是因为页面刷新的假设可能是错误的。我看到一些人构建了大字符串并直接设置html。这可能不是一个非常干净的方法，但在速度方面可能是最好的。是的，我的问题似乎在其他地方-实际上是在循环通过表单元格填充它们时。因此，我同意这里提供的解决方案在创建空表时有效。请进一步查看我的帖子。然后假设延迟是由于页面刷新造成的，这可能是错误的。我见过一些人构建一个大字符串并直接设置html。这可能不是一个非常干净的方法，但在速度方面可能是最好的。是的，我的问题似乎在别处——实际上是在通过表格单元格循环填充它们时。因此，我同意此处提供的解决方案在创建空表时有效。请进一步查看我的帖子。