使用 jQuery 追加元素同时转义文本的最有效方法是什么？答案

【问题标题】：What's the most efficient way to append elements while also escaping text, using jQuery?使用 jQuery 追加元素同时转义文本的最有效方法是什么？
【发布时间】：2011-10-15 23:02:43
【问题描述】：

我正在优化一个瓶颈，不出所料，它是循环中数万个追加的结果。

我熟悉将新元素累积为字符串，然后将它们连接并插入到单个追加中的模式。但是，如果这些元素的文本内容需要转义，即通常使用.text() 设置，该怎么办？

我目前正在将它们创建为单独的元素，将它们附加到 DOM 外部的容器中，然后插入该容器。有更快的方法吗？

【问题讨论】：

为什么不能使用 javascript 转义文本？即使它是正则表达式，它也（或者应该是！）比使用 DOM 快得多。
是的，你说得对，append() 将成为性能瓶颈，只需像text + text 一样将它们连接在一起，然后附加整个块，甚至更好地构建块服务器端然后附加它。如果您需要使用文本，只需将其全部粘贴在包装器 div 中并转到 $("#wrapper").text(block) 然后附加包装器

标签： jquery performance

【解决方案1】：

使用累积作为字符串的方法。如果您需要模拟text() 方法，请使用显示的escapeText 方法，如下所示：

var escapeText = function(s)
{
   return s.split('&').join('&amp;').split('<').join('&lt;').split('>').join('&gt;').split('"').join('&quot;');
};

var someArray = ....
var toInsert = '';
for (var i=0; i<someArray.length; i++)
{
   toInsert += '<p>' + escapeText(someArray[i]) + '</p>';
}
$('#foo').append(toInsert);

【讨论】：