Javascript 如何使用JQuery高效地附加内容

我使用JQuery将大量文本附加到标记中。我发现当前标记中的文本越多，追加速度就越慢，对于大量文本来说，追加速度就太慢

---

有没有更有效的方法来追加文本？例如，创建虚拟子标记并设置其内容，而不是附加到父标记？

不要多次附加，而是将每个字符串存储在数组中，并在附加到数组时加入数组。

用于将一组字符串附加到节点，并查看Nicholas Zakas在幻灯片中的演示“编写高效的javascript”

检查这个和这个：
总的来说：

• 不要在循环中添加.append（）
• 不要直接附加到DOM中
• 构建一个字符串，然后附加它或使用DocumentFragment
• 不要直接附加到DOM中

---

在我测试我的网站时，我注意到

.innerHTML

比jQuery的append方法快得多。虽然这已经被弃用，但在未来的浏览器中支持可能会减少和消失。这意味着

bgcolor

属性仍然有效，我记得有人告诉我大约十年前就已经弃用了。不要追加带有html片段的脚本需要评估时（jQuery似乎会自动执行此操作，导致时间变慢，而使用

innerHTML

时，如果需要，您必须手动执行此操作）.Eval非常慢。如果可能，请不要使用它。正如前面提到的，加入数组比字符串连接更有效。使用变量指向DOM节点（即

var this=document.getElementById（“YourDomNode”）

然后在需要时使用

此

，而不是重复

文档.getElementById

语句）。在函数外部声明变量允许从任何函数访问变量。请注意，这是客户端脚本，因此变量值对每个用户都是唯一的引用。根据您的操作，执行高度重复的字符串可以减少文件大小。如果您必须将JavaScript内联作为ht的一部分进行加载请尝试以下方法：

/* Call this section after appending to the dom with innerHTML */
var f = function() {runScripts(document.getElementById('newDOM_Section'));};
setTimeout(f,1);

/* Stick the following in your main .js file */
var stringScript
var f
function runScripts(element) {
    var scripts = element.getElementsByTagName("script"); 
    var intScriptsCount = scripts.length
        for (var i = 0; i < intScriptsCount; i++) { 
        stringScript = scripts[i].text
            setTimeout(stringScript, 1); 
        }

}

/*在使用innerHTML附加到dom后调用此节*/
var f=function（）{runScripts（document.getElementById（'newDOM_Section'）；}；
设置超时（f，1）；
/*将以下内容粘贴到main.js文件中*/
变量字符串脚本
变量f
函数运行脚本（元素）{
var scripts=element.getElementsByTagName（“脚本”）；
var intscriptscont=scripts.length
对于（var i=0；i

上面的代码将在评估所有脚本之前使DOM更改可见。虽然这不是多线程，但请小心使用。最好使用事件处理程序的属性（onclick、onchange等）

最后，在操作dom中的元素之前，请将样式设置为display:none，然后再将样式设置回display:inline（对于某些常用元素，inline是默认值）或wahtever

---

这只是我使用过的一些策略的一个快速的心理转储，因此任何对不良做法的输入/嘲笑都是受欢迎的。

你确定瓶颈是实际的DOM操作，而不是制造你插入的内容吗？是的-我测试了是否添加了表中的内容（直接在TD中或间接在母链的某个位置），或其他非固定大小的元素？每次操作dom时，都需要重新计算定位。这种效果在没有固定大小的表和元素中更为明显。它都是DIV结构的，但这是一个有趣的想法。如果正确，那么就没有办法解决此延迟…我想向用户反馈太长了，读不下去了，所以我很重要的是，在“你不需要直接添加到DOM”的时候追加内容。在某些时候你需要把你的东西添加到DOM中。这是关于使用DoopTrimeFipe。或者编译字符串并附加它。TL；DR；构建一些东西，并附加到DOM作为最后一步。