IE中的jQuery非常慢

我写了一个代码来过滤元素列表。

HTML：

 
France
Canada
Argentina
Portugal
 
France
Canada
  

使用Javascript：

 function filterAvailable() { var filterText = "ca"; //  0) { $(this).hide(); } else { if ($(this).text().toUpperCase().indexOf(filterText) >= 0) { $(this).show(); } else { $(this).hide(); } } });//each }//end 

我在类’ms-selectable’中用大约500个

元素测试了这个javascript代码。 在我的IE8中，这段代码运行在10000毫秒，而在FF中运行1000毫秒！ 如何在IE中执行此任务？

谢谢！

Answer 1

循环，特别是那些与DOM交互的循环，通常可能会在旧版浏览器中造成性能损失。 通过确保您的选择器更加优化，您可以提供帮助，因为不间断时间旅行建议。 而不是一遍又一遍地重复$(this) ，将元素缓存在变量中：

 var $this = $(this); 

此外，通过使用常规的“for”循环而不是jQuery的$.each()方法，通常可以获得相当大的性能提升：

 function filterAvailable () { var filterText = 'ca'; var items = $('.ms-container .ms-selectable li'); var $currentItem; var a_val; var a_txt; for (var i = 0, j = items.length; i < j; i++) { $currentItem = $(items[i]); // in place of $(this) // Contents of $.each() loop here } } 

很多测试都支持jsPerf： http ：//jsperf.com/jquery-each-vs-for-loop/186

重要的是要记住任何DOM交互（包括查找）都很慢。 当您的页面中包含大量标记时尤其如此。 您可以通过使用ID，缓存选择器，最小化DOM交互和使用常规for循环来加快速度。 以下是Nicholas Zakas的精彩综述： http ： //jonraasch.com/blog/10-javascript-performance-boosting-tips-from-nicholas-zakas