任何人都可以擊敗這個jQuery選擇器？

我一直在運行一些測試，看看我是否能夠找到一個有效的選擇器控件前綴的Asp.Net父控件的ID任何人都可以擊敗這個jQuery選擇器？

我一直在尋找這個，因爲我是可以選擇從外部JavaScript文件的Asp控件（我厭倦了使用ClientID）。

爲了測試我設置了一個包含150個文本框的頁面，所有這些頁面都帶有cssclass「speedy」和一個單獨的id，並運行以下代碼來選擇第107個文本框。

function testclientInput() { 

    var iterations = 100; 
    var totalTime = 0; 

    // Record the starting time, in UTC milliseconds. 
    var start = new Date().getTime(); 

    // Repeat the test the specified number of iterations. 
    for (i = 0; i < iterations; i++) { 
     // Execute the selector. The result does not need 
     // to be used or assigned to determine how long 
     // the selector itself takes to run. 

     // All tests done in ie6, ie7, ie8, ie9beta, firefox3.6, opera11 & chrome8 

     // slowest 
     // $('input.speedy[id$=_TextBox107]'); 

     // Quick but only useful if you know the index. 
     //$($('input.speedy')[106]); 

     //$('[id$=_TextBox107]:first'); 

     //$('input[id$=_TextBox107]'); 

     //$.clientID("TextBox107"); 

     //$('[id$=_TextBox107]'); 

     //$('input[id$=_TextBox107]:first'); 

     //$($('[id$=_TextBox107]')[0]); 

     // Fastest 
     //$($('input[id$=_TextBox107]')[0]); 
    } 

    // Record the ending time, in UTC milliseconds. 
    var end = new Date().getTime(); 

    // Determine how many milliseconds elapsed 
    totalTime = (end - start); 

    // Report the average time taken by one iteration. 
    alert(totalTime/iterations); 

};

這是我想到的最好的。 $($('input[id$=_TextBox107]')[0]);。結果令人驚訝......我期望使用:first選擇器來匹配我的版本，但它報告的結果要慢得多。

任何人都可以想出一種方法來優化呢？

來源

2011-01-06 James South

對不起，爲什麼不能使用`document.getElementById（'_ TextBox107'）`？ ID無論如何都應該是唯一的 – Harmen 2011-01-06 20:16:08

@Harmen：他使用*屬性以*選擇符結束，所以`_TextBox107`只是ID的最後部分。 – user113716 2011-01-06 20:17:23

@Harmen：因爲asp控件的前綴是他們的父ID。我在我的問題中說明了這一點。 – 2011-01-06 20:19:24

這取決於瀏覽器。

這個版本：

$('input[id$=_TextBox107]')

...是一個有效的querySelectorAll選擇，以便實現它的任何瀏覽器將是非常快的。

如果使用:first選擇，你正在使用的東西是不是一個有效的CSS選擇器，所以它默認喜人景象的基於JavaScript選擇器引擎，並會慢得多。

如果性能至關重要，那麼請不要使用jQuery。如果瀏覽器不支持querySelectorAll，您可以使用document.getElementsByTagName()，並過濾所需的一個或多個。

var match; 
if(!document.querySelectorAll) { 
    var inputs = document.getElementsByTagName('input'); 

    for(var i = 0, len = inputs.length; i < len; i++) { 
     if(/_TextBox107/.test(inputs[i].id)) { 
      var match = $(inputs[i]); 
      break; 
     } 
    } 
} else { 
    match = $(document.querySelectorAll('input[id$=_TextBox107]')[0]); 
}

來源

2011-01-06 20:04:37 user113716

我沒有做任何詳盡的測試，但我得到使用「最慢」選擇的是或多或少一樣快，你的「最快」的選擇結果...一些其他的選項均明顯慢了，但。不過，我只使用IE8 ...

我選擇的方法測試閱讀之前，這是......

$("[id$='_TextBox107']")

其執行有點慢，你的「最快」但目前還不是最壞的選擇。我可能需要做更多的測試並重新考慮我的選擇。

來源

2011-01-06 20:23:53 stephen776

任何人都可以擊敗這個jQuery選擇器？

回答

相關問題