What's the purpose of a leading colon in a jQuery selector?

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\'         


        

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 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 );
},