最有效的方法来查找jQuery的

Question

元素如果我有我仅以往适用于表单元素一个CSS类，如：

<form class="myForm"> 

这两个jQuery选择的是最有效的，为什么？

a) $('form.myForm') 

b) $('.myForm') 

Answer 1

由于redsquare已经提到，选择算法在后来的jQuery版本中发生了变化（部分原因是由于支持getElementsByClassName）。此外，我测试了最新的jQuery版本（v1.6），并且还为document.getElementsByClassName添加了一个测试用于比较（至少在Firefox 4和Chrome中有效）。

在Firefox 4的结果是：

// With 100 non-form elements: 
$('.myForm') : 366ms 
$('form.myForm') : 766ms 
document.getElementsByClassName('myForm') : 11ms 

// Without any other elements: 
$('.myForm') : 365ms 
$('form.myForm') : 583ms 
document.getElementsByClassName('myForm') : 11ms 

接受的答案是过时（和仍然被寻找的东西，如“高效的方式来查找jQuery的元素”中找到），并会误导人，所以我觉得我必须写这个。

另外，看看jQuery和原生浏览器选择器函数之间的时差。在jQuery的1.2.6 $('.myForm')比getElementsByClassName较慢超过300 倍，而jQuery的1.6是慢了约倍，但仍快于$('form.myForm')（违背了过时的答案）。

注意：结果通过Firefox 4获得（与Chrome相似）。在Opera 10中，标签名称的查询速度稍快，但Opera也支持更快的本地getElementsByClassName。

测试代码：http://jsbin.com/ijeku5

Answer 2

编辑：下结果的jQuery 1.2.6，很可能在火狐3.5。浏览器和jQuery本身的速度提升已经使这些信息变得过时了。

---

我只是写了一个快速基准测试：

• 在页面上有4种形式和大约100个其它元素：
  • 使用$('form.myForm') 10000次了1.367s
  • 使用$('.myForm') 10000次花费了4.202s（307％）
• 在具有仅4形成并且没有其它元素的页面：
  • 使用$('form.myForm') 10000倍带1.352s
  • 使用$('.myForm') 10000倍带1.443s（106％）

看起来，搜索特定名称的元素比搜索所有元素要快得多r类。

编辑：这里是我的测试程序：http://jsbin.com/ogece

程序与100个<p>标签和4个<form> S初始状态，运行两个不同的测试，消除了<p>标签，并再次运行测试。奇怪的是，当使用这种技术时，form.myForm比较慢。看看你自己的代码，并做出你想要的。

Answer 3

第一个选择器应该更快，因为jQuery可以使用内置函数“getElementsByTagName”来减少它需要过滤的元素数量。第二个必须获取DOM中的所有元素并检查他们的类。

Answer 4

form.myForm IMO更快，因为它只需要查看一个子集/过滤后的元素组，并且不需要迭代整个文档。

Answer 5

尝试slickspeed您可以在其中看到多个js库（包括jquery）中选择器的粗略速度。

Answer 6

第一个示例在使用上下文时速度更快。第二个例子也更快，但不是太多。我扩大你的榜样与上下文进行比较：

http://jsbin.com/uluwe

Answer 7

enobrev，有趣。 我只是跑你的例子，但使用jQuery 1.3测试版2个here

结果....（1.2.6速度在括号中）

// With 100 non-form elements and Context: 
$('.myForm', '#someContainer') : 4063ms (3707ms) 
$('form.myForm', '#someContainer') : 6045ms (4644ms) 

// With 100 non-form elements: 
$('.myForm') : 3954ms (25086ms) 
$('form.myForm') : 8802ms (4057ms) 

// Without any other elements with Context: 
$('.myForm', '#someContainer') : 4137ms (3594ms) 
$('form.myForm', '#someContainer') : 6627ms (4341ms) 

// Without any other elements: 
$('.myForm') : 4278ms (7303ms) 
$('form.myForm') : 8353ms (4033ms) 

Answer 8

来吧家伙？你疯了吗？选择一个元素最迅速方式是最短的方式：

$（“ myForm的‘）比$（’form.myform”），因为第二个变种竟做aditional的检查，以确保更快的方式该元素具有指定的tagName。 MAYBE新的jQuery 1.3将改变这个事情，但在最新的稳定版本中，指定tagName也是错误的。你应该read here。

我想我读的地方MooTools是这样快的方式。好吧..也许在Moo中，不知道，但在jQuery中这是最快的方法。

看看这个探查：

（big pic）

第一只与ID，第二个是形式＃ID（我的博客页面上测试）和工作类选择完全相同。