Question

这是我在这个网站上的第一个问题，所以如果对规则听起来有点缺乏经验，我会提前道歉（尽管我已经快速阅读了。）

无论如何我的问题。

我在SharePoint 2010中构建了一个使用UL的自定义菜单，并通过CSS和一些JQuery进行自定义。

它看起来我想要它并在IE8，FF＆amp;铬。我已经在我们这里的旧机器上进行了测试，它运行良好。

当我在安装了IE7的机器上测试时出现问题。出于某种原因，当悬停在顶部菜单项上时，它会非常缓慢地运行。

我刚刚开始学习JQuery（在上周），所以我希望我的代码完全出错。

以下代码减慢了速度：

$("ul.SIDGlobalNav li:not(ul.SIDGlobalNav li ul li)").mouseenter(function() {
  if ($(this).is(':not(.LISIDCurrentSelected, .SIDCurrentSelectedParent)'))
  {
    $("UL.SIDGlobalNav .LISIDCurrentSelected div, UL.SIDGlobalNav  SIDCurrentSelectedParent div").css('backgroundPosition', 'left top');
    $("UL.SIDGlobalNav .LISIDCurrentSelected div a, UL.SIDGlobalNav .SIDCurrentSelectedParent div a").css('backgroundPosition', 'right top').addClass('tabdown');
    if ($(this).children('ul').length < 1)
    {
      $("UL.SIDGlobalNav .LISIDCurrentSelected ul, UL.SIDGlobalNav .SIDCurrentSelectedParent  ul").css('visibility', 'hidden');
    } 
  }
})

我将解释为什么代码在那里，以便它可以帮助你更多地理解我的想法。

菜单是带有下划线的标签样式菜单。当选择菜单中的选项卡或其中一个子项时，将显示选项卡，并且下拉线上的菜单项可见。

当用户将鼠标悬停在另一个菜单标签上时，我已将JQuery设置为删除当前所选标签并隐藏标记栏。

如果这有帮助，我可以提供图片吗？

关于它可能发生的原因的任何指针都很受欢迎。

提前谢谢。

富

Answer 1

IE6和IE7的整体JavaScript性能非常糟糕; IE8（2x）更好，但仍远远落后于竞争对手。 IE9（测试版）应具有与竞争对手相同或更好的JavaScript性能。

另一个问题是IE（无论如何，<= 8）没有getElementsByClassName方法。因此，当你给它一个基于类的CSS选择器时，JQuery必须做所有的工作，并且它不能依赖于（快速）本机浏览器功能。

尝试尽可能少地评估节点选择器;如果你可以缓存'UL.SIDGlobalNav .LISIDCurrentSelected, UL.SIDGlobalNav .SIDCurrentSelectedParent'结果集，并对其进行子选择，它应该运行得更快。

Answer 2

IE已经知道精灵有严重的缓存问题。发生此减速问题时，请检查浏览器发出的HTTP请求数。可能就是每次运行jquery时都会触发很多请求来获取图像。

如果情况并非如此，我可以帮助您深入了解一些性能优化，以降低JavaScript运行时开支。

Answer 3

试试这个。

$("ul.SIDGlobalNav > li:not(.LISIDCurrentSelected, .SIDCurrentSelectedParent)").mouseenter(function(){
    $("UL.SIDGlobalNav .LISIDCurrentSelected div, UL.SIDGlobalNav .SIDCurrentSelectedParent div").css('backgroundPosition', 'left top');
    $("UL.SIDGlobalNav .LISIDCurrentSelected div a, UL.SIDGlobalNav .SIDCurrentSelectedParent div a").css('backgroundPosition', 'right top').addClass('tabdown');

    if ($(this).children('ul').length < 1)
    {
        $("UL.SIDGlobalNav .LISIDCurrentSelected ul, UL.SIDGlobalNav .SIDCurrentSelectedParent  ul").css('visibility', 'hidden');
    }
});

我已经更改了第一个选择，因此它不会查找子ul，这会消除第一个if语句的需要。

我的自定义JQuery代码导致IE7运行速度非常慢但不是其他浏览器

3 个答案: