Question

Why jQuery do not remove attribute name for class or style when there is no attribute value?

For example, $('<div>').addClass('foo').removeClass('foo') returns [<div class>​</div>​] and not [<div>​</div>​]

My guess is performance, but maybe there are other reasons.

Here is jQuery implementation:

https://github.com/jquery/jquery/blob/master/src/attributes.js#L88

Answer 1

Compare (from Chrome 23):

> $('<div>').addClass('foo').removeClass('foo').attr('class')
""

and:

> $('<div>').attr('class')
undefined

In the former case, the element still has a class attribute, but it has no value.

In the latter case, element has no class attribute at all.

What’s happening is that jQuery uses simple string manipulations to remove classes, and if the resulting string is empty then that’s what’s used – it never removes the class attribute entirely.

In Chrome, even the DOM3 classList functions leave behind an empty class attribute – calling el.classList.add('foo') followed by el.classList.remove('foo') will (in the absence of any other classes) leave you with an empty class.