jQuery .hasClass() vs .is()

Question

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

Answer 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.

Answer 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.