开发者

jQuery .hasClass() vs .is()

is there a preferred method of determining whether an element is assigned a class, from a performance standpoint?

$('#foo')开发者_运维问答.hasClass('bar');

or

$('#foo').is('.bar');


Update:

I committed a test following a comment and four upvotes to very comment. It turns out that what I had said is the correct answer. Here is the result:

jQuery .hasClass() vs .is()

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


The is is multi-purpose, you can for example do is('.class'), is(':checked'), etc which means is has more to do where is hasClass is limited which only checks for a class being set or not.

Hence, hasClass should be faster if performance at any level is your priority.


Since is is more generic than hasClass and uses filter to process the provided expression, it seems likely that hasClass is faster.

I ran the following code from the Firebug console:

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();

I got:

  • usingIs: 3191.663ms
  • usingHas: 2362.523ms

Not a huge difference, but may be relevant if you're doing lots of testing.

EDIT when I say 'not a huge difference, my point is that you need to do 10000 cycles in order to see 0.8s of a difference. I'd be surprised to see a web application such that switching from is to hasClass would see a significant improvement in over all performance. However, I grant that this is a 35% improvement in speed.


Both should be pretty close in terms of performance but $('#foo').hasClass('bar'); seems more readable and semantically correct to me.


.hasClass is much faster than .is You can test it from here. Change the test case according to you.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜