jQuery .hasClass()与.is()


Answers:


164

更新:

我在发表评论后进行了测试,并发表了四票赞成的评论。原来,我所说的是正确的答案。结果如下:

在此处输入图片说明

http://jsperf.com/hasclass-vs-is-so


is多用,可以例如做is('.class')is(':checked')等该装置is具有更多的是其中hasClass被限制仅一类是一组检查或没有。

因此,hasClass如果您优先考虑任何级别的性能,都应该更快。


7
您有证据证明它速度更快吗?仅仅因为一个函数具有较少的功能性并不意味着它会自动更快。
克里斯(Kris)

15
@Kris:是的,我这样做:jsperf.com/hasclass-vs-is-so。就像我说的,hasClass 很多来得更快。
Sarfraz

4
“快得多” =>“快得多”
Kirk Strobeck'4

@SgtPooki,我只是在要求证明;如果是真的,我想知道为什么。我很好奇:)。您可以轻松拥有更多功能,并且速度更快;它总是取决于实现。您的99%是笼统的概括,不一定是软件开发的真实状态。您的问题“ jQuery是否会和纯JavaScript一样快?答案是否定是错误的。” 这不是一个好问题;jQuery实际上有许多优化,一旦缓存数据,它们将提供对DOM元素的更快访问。这实际上取决于您的特定用法。
克里斯(Kris)

1
@SgtPooki尽可能快地看看sizzle选择器引擎;正如我继续提到的那样,它取决于实现方式,并且在不本地支持查询的旧版浏览器中,由于没有本地版本(默认情况下为Win),通过jQuery的实现方式很有可能会更快。同样,如果您要继续调用相同的DOM元素,具体取决于浏览器和版本,则jQuery可能会缓存该元素以加快检索速度,这可能需要花费更多时间。通常,本机JavaScript函数会更快。但这取决于浏览器的支持和实现。
克里斯(Kris)

13

既然is是更通用比hasClass和用途filter来处理所提供的表达,这很可能是hasClass速度更快。

我从Firebug控制台运行了以下代码:

function usingIs() {
for (var i=0; i<10000;i++) {
 $('div#example-0').is('.test');
}
}

function usingHas(){
for (var i=0; i<10000;i++) {
 $('div#example-0').hasClass('test');
}
}

usingIs();
usingHas();

我有:

  • 使用Is:3191.663ms
  • 使用的是:2362.523ms

差异不大,但是如果您要进行大量测试,则可能是有意义的。

当我说“差异不大时,请编辑 ”,我的意思是,您需要做10000个周期才能看到0.8s的差异。我很惊讶地看到一个Web应用程序,从切换到ishasClass将在整体性能上带来重大改进。但是,我认为速度提高了35%。



7

.hasClass.is 您可以从这里测试的速度快得多。根据您的情况更改测试用例。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.