Javascript運行時間過長

Question

我的腳本運行時間過長，這導致我出現此錯誤，即：此頁面上的腳本導致Internet Explorer運行緩慢。

我已經閱讀了有關此錯誤的其他線程，並且了解到有一種方法可以通過在一定數量的迭代后超時來繞過它。

您能幫我在以下功能上申請超時嗎？

基本上，每次我找到要刪除的類型為commit或radio的隱藏輸入時，就會發現它們很多。 請不要懷疑為什么我有很多隱藏的輸入。 我做到了，因為我需要它只是幫助我超時，所以我不會出現JS錯誤。 謝謝

$('input:hidden').each(function(){
    var name = $(this).attr('name');
    if($("[name='"+name+"']").length >1){
        if($(this).attr('type')!=='radio' && $(this).attr('type')!=='submit'){
            $(this).remove();
        }
    }
  });

我發現的示例之一： 使用setTimeout繞過IE的長時間運行的腳本警告

Answer 1

您可能想將input添加到jquery選擇器中，以僅過濾出輸入標簽。

if($("input[name='"+name+"']").length >1){

Answer 2

這是使用setTimeout()尚未（尚未）優化的同一代碼：

var $hidden = $('input:hidden'),
    el;
for (var i = 0; i < $hidden.length; i++) {
  el = $hidden[i];
  if(el.type!=='radio' && el.type!=='submit'
             && $("[name='" + el.name + "']").length >1) {

     $(el).remove();
  }
}

注意，現在每個迭代最多可以有三個函數調用，而原始代碼每個迭代最多可以有十個函數調用。 只需說出this.type （無函數調用），就不需要$(this).attr('type') （兩個函數調用）了。

此外， .remove()僅在滿足三個條件的情況下才會發生，這兩個type進行測試並檢查是否具有相同名稱的其他元素。 首先進行type測試，因為它們很快，並且只有在type部分通過的情況下，才需要對其他元素進行慢速檢查。 （如果左側的操作數不正確，JS的&&不會評估右側的操作數。）

或使用setTimeout() ：

var $hidden = $('input:hidden'),
    i = 0,
    el;
function doNext() {
   if (i < $hidden.length) {
      el = $hidden[i];
      if(el.type!=='radio' && el.type!=='submit'
                && $("[name='" + el.name + "']").length >1) {

         $(el).remove();
      }
      i++;
      setTimeout(doNext, 0);
   }
}
doNext();

您可以通過更改$("[name='" + el.name + "']")來指定特定的元素類型來改進任一版本，例如，如果您僅在使用輸入，則使用$("input[name='" + el.name + "']") 。 同樣，您可以限制某個容器，例如，如果這些輸入全部為某種形式或某種形式。

Answer 3

看來您引用的示例正是您所需要的。 我認為，如果您拿起代碼並替換示例中的while循環（保留if語句以檢查批處理大小），則基本上已經完成。 您只需要打破循環的jQuery版本即可。

Answer 4

嘗試這個：

$("[type=hidden]").remove(); // at the place of each loop

刪除所有隱藏字段將花費很短的時間。

希望對您有所幫助。

JSFiddle示例

Answer 5

冒着陳述明顯的風險； 遍歷DOM尋找與這些CSS選擇器的匹配項是使您的代碼變慢的原因。 您可以通過一些簡單的技巧來減少工作量：

這些字段是否在特定元素內？ 如果是這樣，您可以通過在選擇器中包含該元素來縮小搜索范圍。

例如：

$('#container input:hidden').each(function(){
    ...

您還可以縮小檢查name屬性的字段數

例如：

if($("#container input[name='"+name+"']").length >1){

我也不清楚為什么找到隱藏元素后，為什么要再次使用$("[name='"+name+"']").length >1 。 您沒有解釋該要求。 如果您不需要它，則可以通過將其取出來大大加快該過程。

$('#container input:hidden').each(function(){
    var name = $(this).attr('name');
    if($(this).attr('type')!=='radio' && $(this).attr('type')!=='submit'){
        $(this).remove();
    }
});

如果您確實需要它，我很想知道為什么，但是最好的方法可能是重組代碼，以便它只檢查一次給定名稱的輸入數量，並一次性刪除所有輸入。