jQuery .hasClass() vs .is()
Solution 1:
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:
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.
Solution 2:
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.
Solution 3:
Both should be pretty close in terms of performance but $('#foo').hasClass('bar');
seems more readable and semantically correct to me.