如果我有一个CSS类,我只将其应用于表单元素,例如:
<form class="myForm">
这两个jQuery选择器中哪一个最有效,为什么?
a) $('form.myForm') b) $('.myForm')
解决方法
正如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中它只慢了约20倍,但仍比$(‘form.myForm’)快(与过时的相反)回答).
注意:结果是使用Firefox 4获得的(与Chrome类似的结果).在Opera 10中,使用标记名称进行查询的速度稍快一些,但Opera也支持更快的本机getElementsByClassName.