Question

I’ve starting using the Wijmo toolkit, and came across quite a few example selectors similar to this in their documentation pages:

$(":input[type='radio']").wijradio();

I’d have written mine like this:

$('input[type=radio]').wijradio();

Do these do the same or is there something I’m missing?

Note that there are two differences above: the first selector is prefixed with a colon and has quotes for the input type.

Answer 1

:input is a jQuery extension while input is a CSS selector.

textarea, button, and select elements would be matched by the former, but not the latter.

The latter is faster, so use it for your specific radio example. Use :input when you want “all form elements” even if they aren’t strictly <input> tags. Even in that case, the recommendation is to use a standard CSS selector first, then use .filter(':input') on that set.

Because :input is a jQuery extension and not part of the CSS
specification, queries using :input cannot take advantage of the
performance boost provided by the native DOM querySelectorAll()
method. To achieve the best performance when using :input to select
elements, first select the elements using a pure CSS selector, then
use .filter(“:input”).

In the 1.7.2 source, the :input filter tests a regular expression against the nodeName:

input: function( elem ) {
            return (/input|select|textarea|button/i).test( elem.nodeName );
},