jquery performance td replace

Мне нужно манипулировать сложной таблицей для печати.jquery performance td replace

Мой код работает, но на IE он работает в течение 10 секунд (50 строк таблицы)

Как я могу улучшить производительность?

Я узнал, что $(item).html(title) занимает больше всего времени, как я могу избежать этого?

Благодаря

Код:

  tblTBLRows.find("td[name=tdTBLTitle]").each(function (i, item) { 
      var title = ""; 
      if ($(item).find("*[name=iconForApprove]").length > 0) { title += "<b>[" + msgStatusForApprove + "]</b>&nbsp;" } 
      if ($(item).find("*[name=iconComplete]").length > 0) { title += "<b>[" + msgStatusCompleted + "]</b>&nbsp;" } 
      title += $(item).find("#contTxtTitle").html(); 
      $(item).html(title).removeClass("tdTBLTitle"); 
     });

Html: пример один ряд:

<tr> 
    <td>...</td> 
    <td name="tdTBLTitle" class="tdTBLTitle txtRight" colid="3"> 
      <table cellspacing="0" cellpadding="0" class="tblTskTitle"><tbody><tr> 
      <td> 
       <span class="icon_24 iconVGray" name="iconForApprove" title="...">&nbsp;</span> 
       <span class="spacer5">&nbsp;</span> 
      </td> 
      <td class="tdTxtTitle " name="txtTitle"> 
       <a href="..." class="NoLnk"> 
        <div class="contTxtTitle Pointer" id="contTxtTitle"> 
         Title1 
        </div> 
       </a> 
      </td> 
      <td class="tdDescLast" name="txtDescLast"> 
       <a href="..." class="NoLnk"> 
        <div class="contDescLast Pointer" id="contDescLast"> 
         Title2 
        </div> 
       </a> 
      </td> 
     </tr></tbody> 
     </table> 
    </td> 
    <td>...</td> 
</tr>

источник

2011-02-03 SirMoreno

@sirmorne, не делают .html в петле ИТС дорогостоящей операции, сделать свой HTML финал в строку, а затем сделать .html в из цикла – kobe

и если вы ищете для 'id' вам не нужно искать в каком-либо контексте, так как быстрее просто вызвать' $ ('# anyID') ', хотя для простых вещей даже не используйте jQuery,' document.getElementById (' anyID '). innerHTML' быстрее вернет текст. – zzzzBov

Я знаю, но как можно построить строку из одного TD в каждой строке, а затем использовать ее для замены всех этих TD во всех строках? (данные разные в каждой строке) – SirMoreno

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

var buffer = []; 
buffer.push("string"); // add a bunch of stuff 
var title = buffer.join('');

Существует доказательство того, что это не делает большой разницы, но я недавно использовал это для огромного прироста производительности в IE 7.

источник

2011-02-03 19:09:02

Спасибо, я попробовал, но $ item.html (title) is Главная проблема. – SirMoreno

Жаль, что это не помогло. К счастью, есть много других замечательных предложений для вас попробовать! –

 tblTBLRows.find("#tdTBLTitle").each(function (i, item) { 
     var title = ""; 
     if ($(item).find("*[name=iconForApprove]").length > 0) { title += "<b>[" + msgStatusForApprove + "]</b>&nbsp;" } 
     if ($(item).find("*[name=iconComplete]").length > 0) { title += "<b>[" + msgStatusCompleted + "]</b>&nbsp;" } 
     title += $(item).find("#contTxtTitle").html(); 
     $(item).html(title).removeClass("tdTBLTitle"); 
})

Я предлагаю изменяя * (универсальные селектор) к определенному элементу, который вы ищете, который, кажется, span в этом примере. Таким образом, JQuery это только глядя на конкретных элементов-типов, а не смотреть на, и оценки, каждый элемент находит:

 tblTBLRows.find("#tdTBLTitle").each(function (i, item) { 
     var title = ""; 
     if ($(item).find("span[name=iconForApprove]").length > 0) { title += "<b>[" + msgStatusForApprove + "]</b>&nbsp;" } 
     if ($(item).find("span[name=iconComplete]").length > 0) { title += "<b>[" + msgStatusCompleted + "]</b>&nbsp;" } 
     title += $(item).find("#contTxtTitle").html(); 
     $(item).html(title).removeClass("tdTBLTitle"); 
})

Я не уверен, хотя, сколько времени это может спасти вас; это может быть микро-оптимизация, и если вы не уверены, что элементы, которые вы хотите, всегда будут span, в любом случае это может оказаться невозможным.

источник

2011-02-03 19:10:23

Важная вещь, чтобы кэшировать ссылки на объект Jquery ..

вместо вызова несколько раз больше $(item) делать var $item = $(item); и использовать, что, как $item.find(..)

держать Также в виду, что селектор * очень дорого.

Если вы знаете, что вместо этого вы будете искать промежутки или другие специальные теги.
Например $item.find('span[name=iconForApprove]')

источник

2011-02-03 19:10:31

Например, если 'iconForApprove' всегда находится на интервале, измените селектор на:' span [name = iconForApprove] '. В противном случае браузер буквально проверяет каждый узел, чтобы увидеть, имеет ли он правильное имя, а не просто проверяет пробелы. – calvinf

@calvinf, спасибо, что напомнил мне пример. –

jquery performance td replace

ответ

Смежные вопросы