:button【ボタン要素】セレクタ
メモ
- ボタン要素を選択
$( "button, input[type='button']" )と同等
- パフォーマンス
- ネイティブ DOM querySelectorAll() 未使用の為、低速
.filter(":button")の方が高速 ( 例 参照)
- ネイティブ DOM querySelectorAll() 未使用の為、低速
- 選択対象
- HTML5：<button>【ボタン】
- type属性が"button" (ボタン)のHTML5：<input>【汎用入力コントロール】
- 下記のボタンは選択対象外 (<input>【汎用入力コントロール】)
- type属性が"submit" (送信ボタン) (参照：:submit【送信ボタン要素】)
- type属性が"reset" (リセットボタン) (参照：:reset【リセットボタン要素】)
- type属性が"image" (イメージボタン) (参照：:image【イメージボタン要素】)
- type属性が"file" (アップロードファイル選択) (参照：:file【ファイルタイプ要素】)
- 全てのボタンを選択対象
- selector1, ～ selectorN【複数指定 (OR)】を使用した下記 例 参照
構文
jQuery( ":button" ) 1.0関連
例
<div id="id1">
<p>
<button><button></button>
<button type="button"><button type="button"></button>
<button type="submit"><button type="submit"></button>
<button type="reset"><button type="reset"></button>
</p>
<p>
<input type="button" value='<input type="button">'>
<input type="submit" value='<input type="submit">'>
<input type="reset" value='<input type="reset">'>
<input type="image" value='<input type="image">' style="border:1px black solid;">
</p>
<p>
<input type="file">：<input type="file">
</p>
</div>
<script>
$( "#id1 :button" ).css( "border", "2px red dashed" );
</script>
：<input type="file">
<div id="id2">
<p>
<button><button></button>
<button type="button"><button type="button"></button>
<button type="submit"><button type="submit"></button>
<button type="reset"><button type="reset"></button>
</p>
<p>
<input type="button" value='<input type="button">'>
<input type="submit" value='<input type="submit">'>
<input type="reset" value='<input type="reset">'>
<input type="image" value='<input type="image">' style="border:1px black solid;">
</p>
<p>
<input type="file">：<input type="file">
</p>
</div>
<script>
$( "#id2 *" ).filter( ":button" ).css( "border", "2px blue dashed" );
</script>
：<input type="file">
<div id="id3">
<p>
<button><button></button>
<button type="button"><button type="button"></button>
<button type="submit"><button type="submit"></button>
<button type="reset"><button type="reset"></button>
</p>
<p>
<input type="button" value='<input type="button">'>
<input type="submit" value='<input type="submit">'>
<input type="reset" value='<input type="reset">'>
<input type="image" value='<input type="image">' style="border:1px black solid;">
</p>
<p>
<input type="file">：<input type="file">
</p>
</div>
<script>
$( "#id3 *" ).filter( ":button, :reset, :submit, :image, :file" ).css( "border", "2px red dashed" );
</script>
：<input type="file">