使用JavaScript阻止DOM解析

Blocking DOM Parsing with JavaScript

本文关键字：解析 DOM 阻止 JavaScript 使用      更新时间：2023-09-26

我有一个小问题。我在HTML页面上有一个表，它由JS中的异步调用填充。有成千上万的元素，很明显，它们充满了类，所有这些都是为了让它们变得漂亮：）。

这样做：

for(var i  = 0; i < elements.length; i++){
    var td = document.createElement("td");
    td.className = "all the pretty css";
    var button = document.createElement("a");
    button.className = "btn so pretty wow";
    td.appendChild(button);
    tableTr.appendChild(td);
}

然而，这需要很多时间，通过使用console.time和console.timeEnd，我能够确定整个过程需要大约100ms的JS执行，这意味着时间实际上是通过DOM解析排队的。（我说得对吗？）

所以，我想知道是否有任何方法可以做这样的事情：

Dom.stopParsing();
mySuperFunction();
anotherFunction();
thisTimeAsync(
    function(){
        Dom.parse();
);

因此，有效地减少了解析时间！

使用文档片段：

var frag = document.createDocumentFragment();
for(var i  = 0; i < elements.length; i++){
    var td = document.createElement("td");
    td.className = "all the pretty css";
    var button = document.createElement("a");
    button.className = "btn so pretty wow";
    td.appendChild(button);
    frag.appendChild(td);
}
tableTr.appendChild(frag);
相关文章：