buttonセレクター

セレクター :button は、ボタン要素と タイプが button の全ての要素を選択します。 タグ button、 input （タイプ button）を参照してください。 $(':button') は、 $('button')、$("input[type='button']") と同等です。 :button はCSS仕様には含まれないため、 現代のブラウザーでのパフォーマンスを向上させるには、 まず純粋なCSSセレクターで要素をフィルタリングし、 その後で .filter(':button') を適用する方が良いでしょう。

構文

ボタンを選択する方法：

javascript$(':button');

例

上記の理論に基づいて、すべてのボタンを選択し、 メソッド addClass を使用してクラス marked を追加し、 緑の背景と赤い枠線を適用してみましょう：

html<form>
  <input type="button" value="button">
  <input type="file">
  <button>button</button>
  <input type="reset">
  <input type="radio">
  <input type="text">
</form>

css.marked {
  background-color: green;
  border: 2px red solid;
}

javascript$(':button').addClass('marked');

$('form').submit(function(event) {
  event.preventDefault(); // フォームの送信を防ぐ
});

関連項目