Javascript 如何在jquery中提高性能

我不是一个好的程序员，我刚刚开始使用jQuery。我需要一个表格分拣机，可以扩展和折叠行。我的代码如下。我花了很多时间试图改进它的执行时间。在IE中，这需要很多时间。谢谢你的建议

$(document).ready(function() {
  $('table.sortable').each(function() {
    var $table = $(this);
    var myData = new Array(), myData1 = new Array();
    var rows = $table.find('tbody > tr').get();
    var rowCount = 0;
    $.each(rows, function(index, row){ //arrange rows in 2 dimention array
      if(($(row).children('td').eq(0).attr('class').indexOf('collapse') != -1 || $(row).children('td').eq(0).attr('class').indexOf('expand') != -1)){   
        myData.push(myData1);
        myData1 = [];
      }
      myData1.push(row);    
      rowCount++;
      if(rowCount == $(rows).length){ // to assign last group of rows
        myData.push(myData1);
        myData1 = [];
      }
    });
    $table.find('th').each(function(column) {
      var findSortKey;
      if ($(this).is('.sort-alpha')) {
        findSortKey = function($cell) { 
          return $cell.find('.sort-key').text().toUpperCase() +
            ' ' + $cell.text().toUpperCase();
        };
      }
      else if ($(this).is('.sort-numeric')) {
        findSortKey = function($cell) {
          var key = parseFloat($cell.text().replace(/,/g,''));
          return isNaN(key) ? 0 : key;
        };
      }
      if (findSortKey) {
        $(this).addClass('header').click(function() {
          var newDirection = 1;
          if ($(this).is('.headerSortUp')) {
            newDirection = -1;
          }
          var expand = $table.find('tbody > tr > td.expand').get().length;
          if(expand > 0){
            $.each(myData, function(index, row) {
              $.each(row, function(index1, row2) {
                row2.sortKey = findSortKey($(row2).children('td').eq(column));
              });
            });
            $.each(myData, function(index, row) {
              row.sort(function(a, b) {
                if($(a).children('td').eq(0).attr('class').indexOf('collapse') == -1 && $(a).children('td').eq(0).attr('class').indexOf('expand') == -1 && $(b).children('td').eq(0).attr('class').indexOf('collapse') == -1 && $(b).children('td').eq(0).attr('class').indexOf('expand') == -1 ){
                  return ((a.sortKey < b.sortKey) ? -newDirection : ((a.sortKey > b.sortKey) ? newDirection : 0));
                }
                if(navigator.userAgent.toLowerCase().indexOf('chrome') > -1){
                  return -1; // hack for google chromo
                }
                return 0;
              });
            });
          }else{
            $.each(myData, function(index, row) {
              row.sortKey = findSortKey($(row[0]).children('td').eq(column));
            });
            myData.sort(function(a, b) {
              if (a.sortKey < b.sortKey) return -newDirection;
              if (a.sortKey > b.sortKey) return newDirection;
              return 0;
            });
          }
          // alternate rows goes here and updating table 
          var alt = true;
          var altSub = true;
          $.each(myData, function(index, row) {
            var noRow = $(row).length;
            for (var i=0; i < noRow; i++){
              if($(row[0]).attr('id') == $(row[i]).attr('id')){
                if(alt == true){
                  $(row[0]).removeClass("odd").addClass("even");
                  alt = !alt;
                  altSub =true;
                }else if( alt == false){
                  $(row[0]).removeClass("even").addClass("odd");
                  alt = !alt;
                  altSub = true;
                }
              }else{
                if(altSub == true){
                  $(row[i]).removeClass("alt_row_sub").addClass("alt_row_sub2");
                  altSub = !altSub;
                }else if( altSub == false){
                  $(row[i]).removeClass("alt_row_sub2").addClass("alt_row_sub");
                  altSub = !altSub;
                }
              }
            }
            $table.children('tbody').append(row);
            row.sortKey = null;
          });
          $table.find('th').removeClass('headerSortUp')
            .removeClass('headerSortDown');
          var $sortHead = $table.find('th').filter(':nth-child('
            + (column + 1) + ')');
          if (newDirection == 1) {
            $sortHead.addClass('headerSortUp');
          } else {
            $sortHead.addClass('headerSortDown');
          }
        });
      }
    });
  });
});

$（文档）.ready（函数（）{
$（'table.sortable'）。每个（函数（）{
var$表=$（此）；
var myData=new Array（），myData1=new Array（）；
var rows=$table.find（'tbody>tr'）.get（）；
var rowCount=0；
$.each（行，函数（索引，行）{//以二维数组排列行
if（$（行）.children（'td'）.eq（0）.attr（'class'）.indexOf（'collapse'）！=-1 | | |$（行）.children（'td'）.eq（0）.attr（'class'）.indexOf（'expand'）！=-1））{
myData.push（myData1）；
myData1=[]；
}
myData1.push（行）；
行计数++；
if（rowCount==$（rows.length）{//分配最后一组行
myData.push（myData1）；
myData1=[]；
}
});
$table.find（'th'）。每个（函数（列）{
var findSortKey；
if（$（this）.is（'.sort alpha'））{
findSortKey=函数（$cell）{
返回$cell.find（'.sort key'）.text（）.toUpperCase（）+
''+$cell.text（）.toUpperCase（）；
};
}
else if（$（this）.is（'.sort numeric'））{
findSortKey=函数（$cell）{
var key=parseFloat（$cell.text（）.replace（/，/g'）；
返回isNaN（键）？0：键；
};
}
如果（findSortKey）{
$（this）.addClass（'header'）。单击（函数（）{
var-newDirection=1；
如果（$（this）.is（'.headerSortUp'））{
newDirection=-1；
}
var expand=$table.find（'tbody>tr>td.expand'）.get（）.length；
如果（展开>0）{
$.each（myData，函数（索引，行）{
$.each（行，函数（index1，行2）{
row2.sortKey=findSortKey（$（row2）.children（'td'）.eq（列））；
});
});
$.each（myData，函数（索引，行）{
行排序（函数（a，b）{
if（$（a）.children（'td'）.eq（0）.attr（'class'）.indexOf（'collapse'）==-1&&$（a）.children（'td'）.eq（0）.attr（'class'）.indexOf（'expand'）=-1&$（b）.children（'td'）.indexOf（'collapse'）=-1&$（b）.children（'td'）.eq（0）.attr（'class'）.indexOf（'expand'）=-1）{
返回（（a.sortKeyb.sortKey）－新方向：0））；
}
if（navigator.userAgent.toLowerCase（）.indexOf（'chrome'）>-1）{
return-1；//针对google chromo的hack
}
返回0；
});
});
}否则{
$.each（myData，函数（索引，行）{
row.sortKey=findSortKey（$（行[0]）。children（'td'）。eq（列））；
});
myData.sort（函数（a，b）{
如果（a.sortKeyb.sortKey）返回newDirection；
返回0；
});
}
//替换行位于此处并更新表
var-alt=true；
var altSub=真；
$.each（myData，函数（索引，行）{
var noRow=$（行）.length；
对于（变量i=0；i

下图给出了一些想法。这将对一组行进行排序。

---

表image

首先，我不会尝试在客户端使用JavaScript对我的数据进行排序，但我会在服务器端进行排序。JavaScript不是为性能而设计的，它在处理事情时会阻塞浏览器。

首先，我不会尝试在客户端使用JavaScript对我的数据进行排序，但我会在服务器端进行排序。JavaScript不是为性能而设计的，它在处理事情时会阻塞浏览器。

我不完全确定您想做什么，但是如果您想对表进行排序，您是否考虑过使用这个jQuery插件：

---

编辑：看过你的截图（我想你的链接应该是：），我知道你想做什么。这不是我在jQuery中见过的东西，但ExtJS处理得很好：-这可能对您没有太大帮助，抱歉。

我不完全确定您想做什么，但是如果您想对表进行排序，您是否考虑过使用这个jQuery插件：

---

编辑：看过你的截图（我想你的链接应该是：），我知道你想做什么。这不是我在jQuery中看到的，但ExtJS处理得很好：-这可能对您没有多大帮助，抱歉。

另一个提高操作性能的选项