Question

我用jquery编写了两种迭代。两种解决方案在Internet Explorer版本中的工作速度非常慢。 10（但在IE 10版本中是正常的）并且在所有Firefox浏览器版本中总是很快。

这是第一个解决方案：

var array = jQuery('.mySelectElements');
var i = 0;

$.each(array, function(){
    var nameSelect = jQuery(this).attr("name");
    var htmlSelect = "[name=" + nameSelect + "]";            
    var titleAttribut =  jQuery(htmlSelect).find("option:selected").attr("title");

    if(titleAttribut != "" || titleAttribut != null){           
        var htmlSpanElement = jQuery("#" + "cont_id_" + (i + 1));                       
        jQuery(htmlSpanElement).append(titleAttribut);   
    }
    i++;
});

这是第二个解决方案：

jQuery('.mySelectElements').each(function(i, item) {                        
    var nameSelect = jQuery(item).attr("name");
    var htmlSelect = "[name=" + nameSelect + "]";            
    var atitleAttribut =  jQuery(htmlSelect).find("option:selected").attr("title"); 

    var htmlSpanElement = jQuery("#" + "cont_id_" + (i + 1));   
    jQuery(htmlSpanElement).append(titleAttribut);      
});

我已经停止了使用合适的javascript代码的时间，我已经看到，这两个解决方案在IE浏览器中需要大量时间与firefox浏览器相关。

代码在我的html dom中查找特殊选择元素，并希望迭代它。对于每个select元素，当前选定的值被重新加载并保存在此select元素的特定span元素中。

这种行为可能是什么原因？

非常感谢帮助我！

格尔茨 Marwief

Answer 1

因为Internet Explorer和firefox使用不同的javascript引擎......

Answer 2

我认为您可以稍微优化您的代码：

var spans = jQuery('span.myContainers');
jQuery('.mySelectElements').each(function(i, item) {
    var titleAttribut = jQuery(item).find("option:selected").attr("title"); 
    var htmlSpanElement = spans[i + 1];   
    jQuery(htmlSpanElement).append(titleAttribut);      
});

这样就减少了jQuery查找的数量（它们花费了很多）它将起作用假定：
- 你给你的跨度myContainers - 这些跨度的数量等于或大于选择的数量
- 选择元素的名称是唯一的

较早版本的IE浏览器的JS引擎存在性能问题，因此在这些浏览器上仍会较慢，但您会看到性能提升。

为什么我的JQuery Iteration在IE浏览器中工作得很慢，但在Firefox浏览器中速度很快？

2 个答案: