Какой наиболее эффективный способ добавлять элементы, экранируя текст, используя jQuery?

#jquery #performance

#jquery #Производительность

Вопрос:

Я оптимизирую узкое место, которое, что неудивительно, является результатом десятков тысяч добавлений в цикле.

Я знаком с шаблоном накопления новых элементов в виде строк, затем объединения и вставки их в одно добавление. Но что, если эти элементы содержат текстовое содержимое, которое необходимо экранировать, т. Е. Обычно задается с помощью .text() ?

В настоящее время я создаю их как отдельные элементы, добавляю их в контейнер вне DOM, а затем вставляю этот контейнер. Есть ли более быстрый подход?

Комментарии:

1. Почему вы не можете экранировать текст с помощью javascript? Даже если это регулярные выражения, это (или должно быть!) Намного быстрее, чем использование DOM.

2. да, вы правы, говоря, что append() это будет узким местом в производительности, просто объедините их вместе, text text а затем добавьте весь фрагмент, еще лучше создайте серверную часть блока, а затем добавьте ее. Если вам нужно использовать текст, просто поместите все это в div-оболочку и перейдите $(«#wrapper»).text(блок), а затем добавьте оболочку

Ответ №1:

Используйте метод накопления в виде строки. Если вам нужно смоделировать text() метод, используйте показанный escapeText метод следующим образом:

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

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