Question

我是一名实习程序员，也许我会问一些基本的东西，但我对此感到非常好奇。我正在开发一个呈现桌子的应用程序。我在html中使用DOM元素。因此，我使用document.createElement创建一个表，并使用document.body.appendChild将其附加到文件的主体。这是代码的一部分：

function render_tabla_DOM(tabla){
    var table;
    execute_in_steps([
        {
            what:"create objects",
            how:function(){
                table=document.createElement('table');
                for(var iFila=0; iFila<tabla.length; iFila++){
                    var fila=tabla[iFila];
                    var tr=table.insertRow(-1);
                    for(var iCol=0; iCol<fila.length; iCol++){
                        var celda=fila[iCol];
                        var td=tr.insertCell(-1);
                        td.textContent=celda;
                        td.contentEditable=true;
                    }
                }
                table.className='my_tabla';
            },
        },{
            what:"add to the website",
            how:function(){
                document.body.appendChild(table);
            }
        }
    ]);
}

我有函数execute_in_steps（），因为我控制着完成每件事所需的时间（因为我想尽可能快地完成应用程序）。要创建具有我需要的行数和列数的对象表，需要大约一秒钟。

该表的数据是一个外部.js文件，其中包含一个sql格式的数组（因为将来我将使用该数据库），然后我有一个.CSS文件，使表看起来不错，我试着设置我自己的一切，因为自动选项使表格渲染太慢：

.my_tabla{
    table-layout: fixed; 
    width:50cm; 
    margin:0px;
}

.my_tabla td{
    border:1px solid grey;
    white-space: nowrap;
    width: 100px;
    height:0.5cm;
    margin:0px;
    overflow-x: hidden;
}

好奇的是，当我去浏览器看表时，让我们说70％的时间，表需要6或7秒才能显示，剩下30％的时间，需要1秒和一半。我有一个Windows 7系统，浏览器是Chrome，最终它将是Safari。有人知道时间差异的原因吗？

谢谢！

有时候渲染速度慢，html + CSS

0 个答案: