-1

我有一个关于 jQuery 和 JavaScript 性能的问题。我的应用程序正在使用具有多个选项卡的布局并在它们之间切换，我编写了以下代码：

function openTab(id, holder) {
   $("#" + holder).children(".tab").addClass("visHidden");
    $("#" + id).removeClass("visHidden");
   $("#"+holder+" .tab-nav").removeClass("tab_navAkt");
   if (/^\d*$/.test(id)) {                                 
      $("#"+holder+" ." + id).addClass("tab_navAkt");
   }
}

它这样做：将类添加visibility:hidden到所有选项卡，然后从我想要查看的选项卡中删除此类，然后如果需要，它将选项卡控制元素设置为活动状态。我的问题是，这段代码怎么可能在 Firefox 或 Chrome 中需要大约 3 毫秒，而在 Internet Explorer 7 和 8 中大约需要 500 毫秒？选项卡中的平均数据大小为 500kb，我认为这并不算多。难道我做错了什么？

4

2 回答 2

1

在 JavaScript 执行方面，IE 通常比 FF 和 Chrome 慢。但是您可以优化您的代码并尝试在 IE 中的性能。尝试这个。

function openTab(id, holder) {
   var $holder = $("#" + holder);
   $holder.children(".tab").addClass("visHidden");
   $("#" + id).removeClass("visHidden");
   $holder.find(".tab-nav").removeClass("tab_navAkt");
   //you can get rid of this check. jQuery will addClass only if it finds the element
   //if (/^\d*$/.test(id)) {                                 
      $holder.find(" ." + id).addClass("tab_navAkt");
   //}
}
于 2012-04-24T18:01:03.157 回答
0

我的猜测是它是导致问题的正则表达式。此外，您可以使用.show()and重写它.hide()。

   $("#" + holder).children(".tab").hide();
   $("#" + id).show().addClass("tab_navAct");
于 2012-04-24T17:59:30.273 回答