:buttonS2C Home « Selectors « :button
Form button selector.
Shorthand version $(':button')
Description
The :button
selector, selects all button and type button elements.
Being a jQuery extension the :button
pseudo selector is not part of any current CSS specification. Therefore :button
cannot take advantage of the performance boost provided by the native DOM querySelectorAll()
method.
The same results can be achieved with valid CSS using $("button, input[type='button']")
, without the hit to performance.
If this selector is not preceded by another selector, the universal selector ("*") is implied and so the whole DOM will be searched. Use another selector as in the example below to narrow the search and improve performance.
Syntax
Signature | Description |
---|---|
jQuery(':button') | Form button pseudo-class match |
Parameters
None.
Return
N/A.
:button
Example
Top
Selects all button elements.
In the example below we apply an orange background to 'button' elements within the form filtered by class 'ourform'.
$(function(){
$('.ourform').submit(function () { return false; }); // disable submit
$('#btn1').on('click', function() {
$('.ourform: button').css('backgroundColor', 'orange');
});
});