Should I use "hasClass" before "addClass"?

jquery performance addclass
Curt picture Curt · Nov 13, 2012 · Viewed 26.3k times · Source

I have come across the following script which checks whether an element has class a, and if not, adds it:

if (!$("div").hasClass("a")){
   $("div").addClass("a");
}

As jQuery won't add the class if it already exists, this could be changed to:

$("div").addClass("a");

However, is there any performance improvements by using hasClass first, or is this using the same method which addClass does anyway, and therefore duplicating the logic?

Answer

Jon picture Jon · Nov 13, 2012

The .hasClass() check is not useful because jQuery will also always check from within .addClass(). It's just extra work.

Related questions

jQuery hasClass() - check for more than one class

With: if(element.hasClass("class")) I can check for one class, but is there an easy way to check whether "element" has any of many classes? I am using: if(element.hasClass("class") || element.hasClass("class") ... ) Which isn't too bad, …

Read More
jQuery appending an array of elements

For the purpose of this question lets say we need to append() 1000 objects to the body element. You could go about it like this: for(x = 0; x < 1000; x++) { var element = $('<div>'+x+'</div&…

Read More
When to use Vanilla JavaScript vs. jQuery?

I have noticed while monitoring/attempting to answer common jQuery questions, that there are certain practices using javascript, instead of jQuery, that actually enable you to write less and do ... well the same amount. And may also yield performance benefits. …

Read More