JQuery 1.3+选择器性能

JQuery 1.3+ Selector Performance

本文关键字:性能 选择器 JQuery      更新时间:2023-09-26

我刚刚创建了一个jquery选择器性能测试页面。http://guhelouis.github.com/jquery_performance/

有10000个div,类名从。div-cl-1到。div-cl-10000。我试图得到。div-cl-9999与2个不同的选择器:

  • $ ('div.div - cl - 9999)
  • $ (' .div - cl - 9999 ')

你可能猜到第一个会比第二个快。但是,请查看http://guhelouis.github.com/jquery_performance/(按运行它按钮,抱歉,但它有点慢)的结果,第一个结果将始终是第一个比第二个慢。

,如果您在运行中颠倒顺序,则表示:

  • $ (' .div - cl - 9999 ')
  • $ ('div.div - cl - 9999)

结果又恢复正常了。

是某种"索引"在新的jquery选择器引擎?

PS:这些奇怪的结果只发生在使用jquery 1.3+ (jquery开始使用Sizzle的时候)

两者都是不同的选择器。

$('div.div-cl-1') // select all div elements with class "div-cl-1" 
$('.div-cl-1') // select all elements with class "div-cl-1"

例如:第一个不会选择像

这样的东西
<p>
    <span class="div-cl-1">test</span>
</p>

编辑:刚刚发现这个- http://jsperf.com/jquery-selector-speed-tests

我不确定jQuery,但css选择工作更快,如果你不指定指定类的标签名,因为css首先看类名,然后检查,看看元素是否是指定的标签。假设jQuery使用浏览器的本地查询选择器或类选择器(如果存在的话),第一个选择器将会慢一些。