任何人都可以击败这个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选择器？

回答

相关问题